分享好友 资讯文章首页 资讯文章分类 切换频道

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

2023-03-23 09:12IP属地 广东佛山200建站助手
四种常用HTML5移动应用框架的比较:

【编者按】本文译者范小虎,对于Mobile Web来说,现在是快速成长时代。由于采用了HTML5和CSS3技术,移动浏览器的性能加强了许多,同时,移动app的框架也扩展了,这意味着为移动设备创建丰富的互动的web体验的可行性又提升了。

本文通过对四种常用的框架进行比较,看看新技术带来了哪些改变。

采用诸如PhoneGap这样的封装软件,您就可以使用native app Store以及单个代码库,就可以分布式部署iPhone,iPad和Android等不同的目标平台了。

对于Mobile Web的开发人员来说,切换框架代价很高:因为动画的转换,工具栏,按钮,列表的显示,以及线下存储等都很麻烦。因为大部分上述功能都是新技术,以及这些领域的技术还在迅速地改变。作者玩转了许多Mobile Web的框架并且对它们进行了分析比较,下面将为您讲解他的研究发现。

jQTouch

jQTouch易用性强,相关文档也很全面。它的特色是在 使用HTML,CSS和Javascript创建iPhone App方面拥有出色的能力。jQTouch使用渐进增强的方案,在您相应的HTML顶层来实现像iPhone那样的用户体验。它简单易用,提供了一个基础的小工具集以及动画方案,开发人员只需要编程控制其动态行为即可。

不过在作者的简单测试中发现app的性能存在一定的问题,页面在转换时可能出现跳转或者缺失的情况,以及在响应tap事件的时候还有周期性延迟。该项目在技术上还活跃着,不过原作者的进展和部署都显得太慢了。

只需要遵守MIT的license许可就可以使用jQTouch了,MIT lic是作者最喜欢的开源许可之一。

jQueryMobile

jQuery Mobile是这个领域的新丁,2010年8月才正式宣布成立,但是已经迅速进展到功能丰富的阿尔法2测试版本了。jQuery Mobile跟jQTouch相比很相似,但是更加标准,更有适应性,感觉很像jQTouch的后继版本,对用户接口和style的支持范围更加宽广了。

jQuery Mobile的性能是不稳定的,(虽然比jQTouch好一些)特别是在响应TAP事件的动画延迟补偿的时候。此外,还缺少一些关键的程序hook,所以不能轻松地让app更加具有动态性能。例如:当一个页面启动的时候事件触发了,这时候却无法通知响应的代码页面将转向哪个用户接口,也不能传递附加的信息给处理模块。针对上述问题,创建工作区来解决还是可行的,但是在这里作者希望其将来的版本能从jQTouch那里学习一下,并把现在的功能缺陷处理掉。

jQuery Mobile的相关文档资料很零散但是有所改进,作者很希望它们能变得像核心jQuery库那样具有鲁棒性。(请注意,jQuery Mobile是和jQuery UI相辅相成的,并不是建在单纯jQuery之上的)

想获得jQuery Mobile只需获得MIT或者GPL2 license。

Sencha Touch

这是个与Ext JS框架完全不同的产物,其方案与jQTouch/jQuery完全不同:Sencha生成自己的DOM(基于用Javascript创建的对象)代替了先前存在的HTML增强方式。如此,使用Sencha工作的感觉不像是web编程,而更像是使用Java或者Flex等技术来做app的样子。比起jQuery来,Sencha的感觉更像是YUI。作者个人比较偏好渐进增强的方案,尽管其性能还真有些不尽人意的地方。

sencha跟其竞争对手们相比,扩展性强了很多:它拥有大量的用户接口组件,直接的iPad支持,拥有JSON和HTML5线下存储技术使得存储和数据绑定更加方便。(使用Sencha的数据结构来操作app的数据十分酷~它可以实时响应列表的更新)此外,Sencha还是唯一在工具栏上支持内嵌的对象支持,其他方式都是滚轮列表的样子。

在作者的测试程序中,使用Sencha与jQTouch/jQuery相比,虽然app很明显地不那么轻量级,但是其性能和可靠性方面明显提高了,不过其初始化加载时间略慢。

当您使用库library或者框架frame进行开发的时候,不遵守框架或者用你自己的方式通常都不会获得成功。但Sencha的支持范围足够宽广,这意味着您可以使用Sencha的开发方式来实现任何需求。作者最开始用的是WebKit的内嵌SQLite数据库来做线下存储,但是最终还是因为其复杂性和各种bug问题的烦恼而放弃了,转而使用了Sencha数据存储的功能。

在文档方面,Sencha做的不太好,虽然很广泛,但是又有很多旧版本的老漏洞没有及时更新,作者就在这些框架中与bug作斗争,调试过程浪费了很多时间,因为文档不够健全,很多问题难以追踪或理解。而在开发者论坛响应作者提问的频率还算较高,不过最终感觉还是不太够。Sencha提供的付费技术支持起价是$300每年,作者很强烈地打算付费了,但是Sencha的回应是很好奇地打听为啥这么急着给他们送钱,真搞不懂。

获取Sencha需要遵守GPL3 license,以及在某种不是GPL标准又很相似LGPL的授权下也能用,以及遵循非商业license也可以获得。

TitaniumMobile

与Sencha Touch很相似,Appcelerator公司的Titanium Mobile可以让您使用Javascript API来编写app。不过与Sencha不同的是,Titanium把你的代码编译成Native的iPhone或Android app,这意味着它并不是一个真正的Web框架,而是一个兼容层或者编译器。(请注意Titanium Mobile的近亲Titanium Desktop是一个基于web的,让您可以使用HTML /js来编写桌面封装的本地应用的一款软件)

这么说来Titanium允许web开发人员使用Javascript和一点点XML之类的其他相关技术,可以实现高性能、更换皮肤很方便的Native App,而不需要额外去学习Objective-C或者Cocoa Touch等技术了。作者的简单测试表明其性能不错,吹散了框架方面的疑云,而且整合起来也不是太难。

不过这个优点也是其致命的缺点,您只能作出Titanium所支持的平台上面的应用,你被它们的开发工具限制住了。作者想证明这一点只需要换一个不是iPhone的平台上来跑一下就知道了。同时,Titanium的调试器也不怎么样,不能使用XCode方式运行或者调试,就算在其仿真器上面程序跑的还算不错,还是需要作者自己去实际机器上自己再找问题。

分析

作者在这4个框架上面挑选了3种并编造了自己的app来试一试,过程虽然很冗繁,但是收获也颇丰。作者很喜欢jQTouch,但是不太相信它会在现有版本上再前进多少了。对于jQuery Mobile,很赞赏其简单易用性以及其以web为中心的开发方法,不过它的缺点是缺少核心特色,跟Sencha比性能差很多。

用一个阿尔法2版本的产品来跟一个1.0版本的正式版相比或许有失公平,但是在用户具有很强烈的刚性用户需求时就必须做出选择了,于是作者选择了Sencha Touch。作者最初被其强大的性能和宽广的支持程度所吸引,最终更喜欢其开发风格。随着开发的深入,其文档的漏洞让作者十分沮丧,但是其广泛的支持程度依旧吸引着作者,渐渐适应了其开发风格。如果他们愿意回复邮件的话,作者很有意向付费以获取技术支持。不过现在,Pints的发布已经是一个基于Sencha的app了。

结论

作者还没有回答最大的问题呢:一个基于web的app在没有本地app的情况下能否hold住局面?如果可以的话,实现这样的技术是否值得舍弃原来那种单一代码库方式所带来的代价呢?

鉴于两星期以来Pints的实际应用,作者倾向于说不。Pints在性能和bug方面陷入僵局,平均每隔10-15秒页面就乱跳,在滚动页面的时候容易乱跳,动画效果也不是很连贯。

VIA:dzyngiri

译文出处:WebAppTrend几种常用HTML5移动应用框架的比较

举报
收藏 0
打赏 0
评论 0
“离子膜”弯道超车记
  离子膜有什么用?  膜材料为我们生产生活提供了安全和便利,比如蔬菜大棚的薄膜,汽车玻璃上的防爆膜,手机面板上的保护膜等。膜材料也是燃料电池和液流电池的关键部件,这种用途的膜材料,被称为离子膜。离子膜,就是含功能基团的、对溶液里的离子具有选择透过能力的高分子膜。  传统的离子膜材料,用于传导离子的通道不够“坚固”,长时间使用后,结构会发生老化,从而导致性能下降。中国

2023-04-2743

新方法实现常温常压下二氧化碳捕获与释放
  记者24日从中国科学技术大学获悉,该校刘波教授、南方科技大学徐强教授与国际研究团队合作,首次用二氧化碳作为客体分子模拟二氧化碳水合物结构,使用廉价的硫酸胍与二氧化碳共结晶形成稳定的包合物,实现了环境温度压力条件下二氧化碳可逆的捕获与释放。这有望成为一种很有潜力的碳捕获和存储方法,相关研究成果日前发表在《细胞报告物质科学》上。  碳捕获是碳捕集利用与封存技术的重要环

2023-04-2623

史上最刚MPV名不虚传!极氪009隧道被大巴追尾:框架几无变形
一般而言,由于结构的特殊性,MPV相比于轿车和SUV,在安全性尤其是碰撞安全方面会比较难做,但随着一体式压铸技术的诞生,这种情况发生了改变。4月5日,有博主发布了一条极氪009在隧道内遭遇严重追尾事故的微博,从现场看,这台极氪009被一双层大巴车迎面撞上,又被推着撞上了前面的一台SUV。撞击相当惨烈,大巴车头凹陷,挡风玻璃也支离破碎,但反观极氪009,除了塑料保险杠出

2023-04-0524

详解:怎么让一个HTML元素的区域铺满全屏?
详解:怎么让一个HTML元素的区域铺满全屏?:现在很多网页都做得特别绚,因此很多时候大家都想着实现一些看上去吊炸天的效果,而这些前端的效果不管怎么华丽最原始的基础还是那一行行的代码,HTML+CSS+JS就是前端的三剑客。今天我们就讲一讲我们最近的一个实践,吗就是让一副图片填满整个屏幕(除去浏览器所占区域哦)。通常有两种比较经典的效果,用到的原理之一就是这个。一个就是

2023-03-2335

对单页面网站seo的几点看法
对单页面网站seo的几点看法:单页面站就是指网站中只有少数的几个页面,然后利用seo技术来做相关关键词的排名。以前我做个几个单页面网站的seo实验,总结出一些自己的方法。(最近刚刚做的一个单页面站www.see001.com/caoliu.htm)下面我来谈一下个人关于单页面网站seo的看法。(本人菜鸟,高手见笑了)第一,单页面网站雏形时候不要过分seo优化。我相信大

2023-03-2325

谷歌网站排名,内容与页面体验,谁更重要?
谷歌网站排名,内容与页面体验,谁更重要?:在做谷歌SEO的过程中,我们每天都在面临抉择,毕竟它是一个复杂的排序机制,影响因子有诸多因素,但有的时候,为什么我们会脱颖而出。在某种角度,我们一定是某一个小细节,超越对方,比如:页面体验度,特别是当页面相似度非常高的时候,我们认为这个影响因素,非常重要。那么,谷歌SEO里的页面体验度和内容相似性,谁更重要?根据以往谷歌SEO

2023-03-2328

网页设计和平面设计的功底结合
网页设计和平面设计的功底结合:一个好的网页设计师,是不是平面设计的功底就很高呢? 会平面设计的设计师就一定能做网页设计师呢? 现在的网站建设公司竞争激烈,甚至在校大学生团队都出来接活,抢网站建设的单,把行业搅乱了,行业的项目价格越来越低.在行业中的锻炼让我个人感觉, 一个好的网页设计师那一定必须有平面很好的功底,而具备平面设计的能力的人,不一定就能胜任网页设计师, 因

2023-03-1331

遇强则强?宏光MINIEV怼上奔驰ML:结果大跌眼镜
战力不详,遇强则强!作为国内最受欢迎的微型电动车,宏光MINIEV狂卖数百万台彻底封神,不管你在哪里,总能看到它们跑在路上的身影,但由于是微型车,身材瘦小、体积不大,MINIEV的安全性也备受关注,那么它在“实战中”表现如何?3月7日,有博主放出了一起罕见事故的现场图,一台MINIEV怼上了一台奔驰ML(GLE前身),前者是微型车,后者是中大型

2023-03-0726

基础代码全部捐献 设备数超3.2亿 华为下周召开鸿蒙大会
华为的HarmonyOS鸿蒙已经成为全球第三大移动生态系统,不仅有华为自己使用鸿蒙,他们还把代码捐献给开源社区,其他厂商也可以接入鸿蒙生态,下周华为还将召开鸿蒙峰会介绍最新进展。据华为开源消息,第一届开放原子开源基金会OpenHarmony(开源鸿蒙)技术峰会即将于2月25日(下周六)在深圳启幕,主题是“技术构筑万物智联,创新使能行业发展”,华

2023-02-2124