几种常用HTML5移动应用框架的比较

openkk 9年前
   <p>        英文原文:<a href="/misc/goto?guid=4958343024506353738" target="_blank">Comparing HTML5 Mobile Web Framework</a></p>    <p>        对于 Mobile Web 来说,现在是快速成长时代。由于采用了 <a href="/misc/goto?guid=4958343025319508064" target="_blank">HTML5</a>和 <a href="/misc/goto?guid=4958343026135870445" target="_blank">CSS3</a>技 术,移动浏览器的性能加强了许多,同时,移动 app 的框架也扩展了,这意味着为移动设备创建丰富的互动的 web 体验的可行性又提升了。采用诸如 PhoneGap 这样的封装软件,您就可以使用 native app Store 以及单个代码库,就可以分布式部署 iPhone,iPad 和 Android 等不同的目标平台了。</p>    <p>        对于 Mobile Web 的开发人员来说,切换框架代价很高:因为动画的转换,工具栏,按钮,列表的显示,以及线下存储等都很麻烦。因为大部分上述功能都是新技术,以及这些领域的 技术还在迅速地改变。作者玩转了许多 Mobile Web 的框架并且对它们进行了分析比较,下面将为您讲解他的研究发现。</p>    <p style="text-align:center;"><img style="width:559px;height:310px;" title="几种常用 HTML5 移动应用框架的比较" border="0" alt="几种常用HTML5移动应用框架的比较" src="https://simg.open-open.com/show/ccfa5ceee282e76055c750c3562be8a2.jpg" width="630" height="350" /></p>    <p>        <strong>jQTouch</strong></p>    <p>        <a href="/misc/goto?guid=4958190860408140810" target="_blank">jQTouch</a> 易用性强,相关文档也很全面。它的特色是在 <a href="/misc/goto?guid=4958341553696515131" target="_blank">使用 HTML,CSS 和 JavaScript 创建 iPhone App</a> 方面拥有出色的能力。jQTouch 使用渐进增强的方案,在您相应的 HTML 顶层来实现像 iPhone 那样的用户体验。它简单易用,提供了一个基础的小工具集以及动画方案,开发人员只需要编程控制其动态行为即可。</p>    <p>        不过在作者的简单测试中发现 app 的性能存在一定的问题,页面在转换时可能出现跳转或者缺失的情况,以及在响应 tap 事件的时候还有周期性延迟。该项目在技术上还活跃着,不过原作者的进展和部署都显得太慢了。</p>    <p>        只需要遵守 MIT 的 license 许可就可以使用 jQTouch 了,MIT lic 是作者最喜欢的开源许可之一。</p>    <p>        <strong><a href="/misc/goto?guid=4958343028399828108" target="_blank">jQuery Mobile</a></strong></p>    <p>        <a href="/misc/goto?guid=4958183601317272178" target="_blank">jQuery Mobile</a> 是这个领域的新丁,2010年 8 月才正式宣布成立,但是已经迅速进展到功能丰富的阿尔法 2 测试版本了。jQuery Mobile 跟 jQTouch 相比很相似,但是更加标准,更有适应性,感觉很像 jQTouch 的后继版本,对用户接口和 style 的支持范围更加宽广了。</p>    <p>        jQuery Mobile 的性能是不稳定的,(虽然比 jQTouch 好一些)特别是在响应 TAP 事件的动画延迟补偿的时候。此外,还缺少一些关键的程序 hook,所以不能轻松地让 app 更加具有动态性能。例如:当一个页面启动的时候事件触发了,这时候却无法通知响应的代码页面将转向哪个用户接口,也不能传递附加的信息给处理模块。针对上 述问题,创建工作区来解决还是可行的,但是在这里作者希望其将来的版本能从 jQTouch 那里学习一下,并把现在的功能缺陷处理掉。</p>    <p>        jQuery Mobile 的相关文档资料很零散但是有所改进,作者很希望它们能变得像核心 jQuery 库那样具有鲁棒性。(请注意,jQuery Mobile 是和 jQuery UI 相辅相成的,并不是建在单纯 jQuery 之上的)</p>    <p>        想获得 jQuery Mobile 只需获得 MIT 或者 GPL2 license。</p>    <p>        <strong>Sencha Touch</strong></p>    <p>        <a href="/misc/goto?guid=4958343029935168776" target="_blank">Sencha Touch</a> 是与 <a href="/misc/goto?guid=4958343030729931363" target="_blank">Ext JS</a> 框架完全不同的产物,其方案与 jQTouch/jQuery 完全不同:Sencha 生成自己的 DOM(基于用 JavaScript 创建的对象)代替了先前存在的 HTML 增强方式。如此,使用 Sencha 工作的感觉不像是 web 编程,而更像是使用 Java 或者 Flex 等技术来做 app 的样子。比起 <a href="/misc/goto?guid=4958183308549259819" target="_blank">jQuery</a> 来,Sencha 的感觉更像是 <a href="/misc/goto?guid=4958318305118985369" target="_blank">YUI</a>。作者个人比较偏好渐进增强的方案,尽管其性能还真有些不尽人意的地方。</p>    <p>        sencha 跟其竞争对手们相比,扩展性强了很多:它拥有大量的用户接口组件,直接的 iPad 支持,拥有 JSON 和 HTML5 线下存储技术使得存储和数据绑定更加方便。(使用 Sencha 的数据结构来操作 app 的数据十分酷~它可以实时响应列表的更新)此外,Sencha 还是唯一在工具栏上支持内嵌的对象支持,其他方式都是滚轮列表的样子。</p>    <p>        在作者的测试程序中,使用 Sencha 与 jQTouch/jQuery 相比,虽然 app 很明显地不那么轻量级,但是其性能和可靠性方面明显提高了,不过其初始化加载时间略慢。</p>    <p>        当您使用库 library 或者框架 frame 进行开发的时候,不遵守框架或者用你自己的方式通常都不会获得成功。但 Sencha 的支持范围足够宽广,这意味着您可以使用 Sencha 的开发方式来实现任何需求。作者最开始用的是 <a href="/misc/goto?guid=4958343032997070936" target="_blank">WebKit</a> 的内嵌 SQLite 数据库来做线下存储,但是最终还是因为其复杂性和各种 bug 问题的烦恼而放弃了,转而使用了 Sencha 数据存储的功能。</p>    <p>        在文档方面,Sencha 做的不太好,虽然很广泛,但是又有很多旧版本的老漏洞没有及时更新,作者就在这些框架中与 bug 作斗争,调试过程浪费了很多时间,因为文档不够健全,很多问题难以追踪或理解。而在开发者论坛响应作者提问的频率还算较高,不过最终感觉还是不太够。 Sencha 提供的付费技术支持起价是$300每年,作者很强烈地打算付费了,但是 Sencha 的回应是很好奇地打听为啥这么急着给他们送钱,真搞不懂。</p>    <p>        获取 Sencha 需要遵守 GPL3 license,以及在某种不是 GPL 标准又很相似 LGPL 的授权下也能用,以及遵循非商业 license 也可以获得。</p>    <p>        <strong>Titanium Mobile</strong></p>    <p>        与 Sencha Touch 很相似,Appcelerator 公司的 <a href="/misc/goto?guid=4958343033796911492" target="_blank">Titanium Mobile</a> 可以让您使用 Javascript API 来编写 app。不过与 Sencha 不同的是,Titanium 把你的代码编译成 Native 的 iPhone 或 <a href="/misc/goto?guid=4958343034590400584" target="_blank">Android</a> app,这意味着它并不是一个真正的 Web 框架,而是一个兼容层或者编译器。(请注意 Titanium Mobile 的近亲 <a href="/misc/goto?guid=4958343035395196573" target="_blank">Titanium Desktop</a> 是一个基于 web 的,让您可以使用 HTML /js 来编写桌面封装的本地应用的一款软件)</p>    <p>        这么说来 Titanium 允许 web 开发人员使用 JavaScript 和一点点 XML 之类的其他相关技术,可以实现高性能、更换皮肤很方便的 Native App,而不需要额外去学习 Objective-C或者 Cocoa Touch 等技术了。作者的简单测试表明其性能不错,吹散了框架方面的疑云,而且整合起来也不是太难。</p>    <p>        不过这个优点也是其致命的缺点,您只能作出 Titanium 所支持的平台上面的应用,你被它们的开发工具限制住了。作者想证明这一点只需要换一个不是 <a href="/misc/goto?guid=4958343036194480717" target="_blank">iPhone</a> 的平台上来跑一下就知道了。同时,Titanium 的调试器也不怎么样,不能使用 XCode 方式运行或者调试,就算在其仿真器上面程序跑的还算不错,还是需要作者自己去实际机器上自己再找问题。</p>    <p>        <strong>分析</strong></p>    <p>        作者在这 4 个框架上面挑选了 3 种并编造了自己的 app 来试一试,过程虽然很冗繁,但是收获也颇丰。作者很喜欢 jQTouch,但是不太相信它会在现有版本上再前进多少了。对于 jQuery Mobile,很赞赏其简单易用性以及其以 web 为中心的开发方法,不过它的缺点是缺少核心特色,跟 Sencha 比性能差很多。</p>    <p>        用一个阿尔法 2 版本的产品来跟一个1.0版本的正式版相比或许有失公平,但是在用户具有很强烈的刚性用户需求时就必须做出选择了,于是作者选择了 Sencha Touch。作者最初被其强大的性能和宽广的支持程度所吸引,最终更喜欢其开发风格。随着开发的深入,其文档的漏洞让作者十分沮丧,但是其广泛的支持程度 依旧吸引着作者,渐渐适应了其开发风格。如果他们愿意回复邮件的话,作者很有意向付费以获取技术支持。不过现在,Pints 的发布已经是一个基于 Sencha 的 app 了。</p>    <p>        <strong>结论</strong></p>    <p>        作者还没有回答最大的问题呢:一个基于 web 的 app 在没有本地 app 的情况下能否 hold 住局面?如果可以的话,实现这样的技术是否值得舍弃原来那种单一代码库方式所带来的代价呢?</p>    <p>        鉴于两星期以来 Pints 的实际应用,作者倾向于说不。Pints 在性能和 bug 方面陷入僵局,平均每隔 10-15秒页面就乱跳,在滚动页面的时候容易乱跳,动画效果也不是很连贯。</p>    <div id="come_from">    来自:     <a id="link_source2" href="/misc/goto?guid=4958343036987202368" target="_blank">www.webapptrend.com</a>    </div>