基于Html5的移动应用开发经验总结：第一篇--架构选型篇（下）

1.3 Html5框架选型

使用Html5来作为移动应用开发并不是新鲜事了，通过使用Html5+JavaScript+Css3可以创建丰富的交互式Web或移动体现，例如你可以使用PhoneGap框架来包装你的应用，同时通过他们提供的iPhone、iPad以及Android的多种API类库来完成一套代码多个平台的应用程序分发工作。
为了更丰富、更快、更好也更容易的实现移动应用，大家不必事事亲力亲为，可以利用现在丰富的开源框架集，合理的利用这些框架集可以提到事半功倍的作用，但具体要使用哪一个框架集就是一个问题了，网络当中类似的文章也很多，各有所长。不过我觉得主要的思路是简单好用、扩展性强、更新延续性好，尤其是延续性，要看这个框架集是否有小组或团队在进行维护更新。下面就几个比较流行的框架集来进行简要介绍一下。

1.3.1 jQTouch
jQTouch的详细介绍可以参考网址（http://baike.baidu.com/view/3778150.htm）。
jQTouch简单易用，尤其针对iPhone、Android、iPad、iPod提供了较为丰富的基本不见以及动画效果和脚本控制，但在测试的时候发现其性能上还是有待升级，毕竟现在只是1.0Beta版本，在进行页面过渡或动画效果的时候会出现跳跃或丢失的情况出现。

 

1.3.2 jQuery Mobile
jQuery Mobile的详细介绍可以参考网址（http://JQuerymobile.com）。
相信大家对JQuery比较熟悉，jQuery Mobile则是在JQuery的基础之上衍生而来，主要是针对移动终端提供完整而统一的JavaScript+Css解决方案。在JQuery Mobile网站的首页你就可以看到一个iPad模拟器，在这个界面上你可以直接模拟器即时生成一个移动应用的界面基础设计，并可以直接预览或打包下载，这位初学者提供了很好的帮助，很多时候要实现什么效果可以直接在这个界面上进行试验然后下载代码参考修改。

于此同时jQuery Mobile还提供了一套在线样式设计的功能，在这里你可以使用可视化的方式来进行UI展现模块及CSS定制设计。如下图所示：

最重要的是jQuery Mobile的SDK文档是我最喜欢的，条理清楚，方便查找，且每一个功能都有示例效果和代码，这对开发来讲无疑是最重要的选型加分依据。

1.3.3 Sencha Touch
Sencha Touch的详细介绍可以参考网址（http://www.sencha.com ）。
有关Sencha相信很多做过Web前端的朋友并不陌生，ExtJs也是他们的产品，可以快速将你的应用从外观上看起来更像一个App。针对Sencha Touch下面是官方给出的几个特性：
1. 基于最新的WEB标准 – HTML5，CSS3，JavaScript。整个库在压缩和gzip后大约80KB，通过禁用一些组件还会使它更小。
2. 支持世界上最好的设备。Beta版兼容Android和iOS，Android上的开发人员还可以使用一些专为Android定制的主题。
3. 增强的触摸事件。在touchstart、touchend等标准事件基础上，增加了一组自定义事件数据集成，如tap、swipe、pinch、rotate等。
4. 数据集成。提供了强大的数据包，通过Ajax、JSONp、YQL等方式绑定到组件模板，写入本地离线存储。
以上是优点，当然每个产品也都存在缺陷，就我个人感觉，Sencha的产品都有一个统一的问题，就是接管的内容太多了，不如JQuery那么简练，虽然展现很悬，但是如果你想要在原有的基础之上做修改，那么你将掉入无限的Js代码之中。另外由于其接管的方法和类过多，导致原生的或者与JQuery兼容的时候存在一些问题。所以我只是一直在参考他的效果，但是并没有实际使用。

1.3.4 总结
如果针对一个有一定Html+Css+JavaScript经验的开发者来讲jQuery有用比较大的优势，一是结构简单，二是后续扩展开发较容易。同时jQuery拥有众多的Plugin，开发者可以直接使用或借鉴之后二次开发。如果使用Sencha，则需要在前期产品设计时作出比较深入的计划，同时最好拥有Ext的相关开发经验，否则建议先好好学习一下，毕竟选型在一个产品设计初期还是非常重要的。

下一章将开始简要介绍Html5的特性以及开发经验，然后结合jQuery Mobile进行开发实例讲解。