在过去大约一个月的时间里,我一直在使用JQuery
Mobile为一个健身培训网站开发基于HTML5的手机/平板前端应用。我之前曾经写过Android和iOS应用程序(分别用Java和Objective-C),因此只要编写一段基础代码就可以在主流平台上运行并能够快速地用HTML和JavaScript迭代,这样的许诺十分诱人。
JQuery
Mobile & HTML5
使用HTML5和JavaSript构建一个手机应用,你需要写很多JavaScript代码。然而,带有触摸屏的设备的UI控制和处理与标准的Web应用程序非常不同。因此,你会想要使用现成的手机HTML5/JavaScrip框架(除非你有很多的时间并且打算将所有东西重新构建)。现在有很多现成的框架可供选择:jQTouch、<wbr><a href="http://www.sencha.com/products/touch">Sencha
Touch</a><wbr>等等。</wbr></wbr>
我成为JQuery的粉丝已经很多年了,尤其欣赏它的至简哲学以及出色的核心特性和插件以及社区的贡献。正是由于有JQuery,我才能够接受使用JavaScript开发。所以,当听到
Chris McDonough(Pyramid
Python Web<wbr>框架的作者)发布JQuery的好消息时,我知道我应该去试一试。</wbr>
<wbr></wbr>
JQuery
Mobile 和 HTML5 的 3个优点
1.<wbr>上手迅速并支持快速迭代:在一个星期多一点的时间里,通过阅读JQuery
Mobile文档以及O’Reilly出版的JQuery
Mobile书籍,我完成了一个可以工作的app初步版本。在此之前我没有HTML5 / JQuery
Mobile开发经验。与Android和iOS相比,使用JQuery
Mobile和HTML5构建你的UI和逻辑会比在原生系统下构建快得多。</wbr>
译注:原生系统:原装的操作系统,例如Android原生系统是Google发布未经修改的系统。在本文中,原生应用指直接用系统提供的API开发的程序,与JQuery
Mobile开发的程序相对应。
我发现Apple的Builder接口的学习曲线十分陡峭,同样学习令人费解的Android布局系统也很耗时间。此外,要使用原生代码将一个list
view连接到远程的数据源并具有漂亮的外观是十分复杂的(在Android上是ListView,
在iOS上是UITableView)我能够通过已经掌握的JavaScript和HTML/CSS知识快速地实现同样的功能,无需学习新的adapter,delegate等等抽象概念,只要编写JQuery代码就可以做到。
2.避免麻烦的应用商店审批过程以及调试、构建带来的痛苦:为手机开发应用,尤其是iOS系统的手机,最痛苦的过程莫过于通过Apple应用商店的审批。想要让一个原生应用程序发布给iOS用户,你需要等待一个相当长的过程(需要好几天,甚至可能是好几周)。不仅在第一次发布程序时要经历磨难,以后的每一次升级也是如此。这使得QA和发布流程变得复杂,还会增加额外的时间。由于JQuery
Mobile应用程序仅仅是一种web应用程序,因此它继承了所有web环境的优点:当用户加载你的网站时,他们就马上“升级”到最新的版本。可以马上修复bug和添加新的特性。即使是在Android系统——应用市场的要求比起Apple环境要宽松得多,在用户不知不觉中完成产品升级也是一件很好的事情。
进一步的好处是,发布beta或测试版本会更加容易。只要告诉用户用浏览器打开你的网址就可以了!不需要考虑iOS令人抓狂的DRM,也不需要理会Android必须的APK。
3.支持跨平台和跨设备开发:一个巨大的好处是,我的应用程序马上可以在Android和IOS上工作,同样也可以在其他平台上工作。作为一个独立开发者,为不同的平台维护基础代码是一项巨大的工作。为单个手机平台编写高质量的手机应用需要全职工作,为每个平台重复做类似的事情需要大量的资源。应用程序能够在Android和IOS设备上同时工作对我来说是一个巨大收获。
更进一步,尤其是对于运行Android各种分支的设备,它们大小和形状各异,想要让你的应用程序在各种各样屏幕分辨率的手机上看起来都不错,这是真正的挑战。对于要求严格的Android开发者来说,按照屏幕大小进行设屏幕分割(从完全最小化到最大进行缩放)会需要很多开发时间。由于浏览器会在每个设备上以相同的方式呈现,关于这个方面你不必有任何担心。
<wbr><a href="http://cdn2.jobbole.com/2012/11/jquery-mobile-logo.jpg" title="jquery-mobile-logo"><img title="jquery-mobile-logo" src="http://simg.sinajs.cn/blog7style/images/common/sg_trans.gif" real_src="http://cdn2.jobbole.com/2012/11/jquery-mobile-logo.jpg" alt="jquery-mobile-logo" width="440" height="125" style="margin: 0px; padding: 0px; font-size: 0px; color: transparent; vertical-align: middle; max-width: 100%; height: auto;"></a></wbr>
<wbr></wbr>
JQuery
Mobile 和 HTML5 的3个缺点
1.比原生程序运行慢:在我看来最大的缺点是,即使是在最新的Android和iOS硬件上(双核Tegra
2 Android手机,双核iPad2平板),JQuery Mobile应用程序都会明显慢
于原生程序。尤其是在Android上,浏览器比起iOS更慢且bug更多(虽然谷歌是专注web领域的公司)。我没有在更早的Android设备上测试我的程序,也许根本就不能运行(例如Android
G1)。我相信在未来的12-24个月,硬件速度会很快得到提升(例如,四核设备2011年马上就要上市),性能也许很快就不会成为问题。但是今天,它确实是一个缺点。如果你只专注于iOS,你大可以期待一下浏览器的性能,至少它在这方面是可靠的(不像Android,黑莓等等)
2.古怪(跨浏览器、跨平台开发):JQuery
Mobile现在仍是beta版本,因此我遇到了很多bug。也就是说,JQuery团队还在积极地回复GitHub上提出的问题。我认为其中最大的一个问题是各种浏览器在不同的手机平台上古怪的表现。这个问题一直为人诟病。应用程序可能看上去有些古怪——虽然我认为JQuery
Mobile团队在widget和主题上做得很棒,但的确和原生程序看起来有显著的不同。这个问题到底对用户有多大影响不得而知,但是这一点需要引起注意。
3.<wbr>有限的能力
vs
原生程序:很明显,运行在浏览器上的JavaScript不能完全地访问设备的很多特性。一个典型的例子就是摄像头。然而,类似PhoneGap这样的工具能够帮助解决很多常见问题。实际上,我已经开始将我的应用程序通过PhoneGap将几个版本部署到iOS和Android上,使用的是原生Facebook绑定,效果令我映像深刻。我会在未来的博客中写一些使用PhoneGap的经验。</wbr>
<wbr></wbr>
总结
总的说来,我认为使用JQuery
Mobile和HTML5作为手机应用开发平台是可行的。然而,这并不适用于(至少到目前为止)所有类型的应用程序。对于简单的内容显示和数据输入类型的应用程序(相对的是需要丰富多媒体/游戏程序),它是对原生程序一个有力的增强。我对自己的应用程序使用新平台的结果感到高兴——不再需要同时为Android和iOS维护我的健身跟踪软件。
在接下来的1-2年中,随着硬件变得越来越快,手机设备越来越多样化,我相信HTML5 (JQuery Mobile, PhoneGap,
等等)在手机应用开发中会成为更加重要的技术。
相关推荐
[Packt Publishing] Dreamweaver CS6 移动网络应用开发 (HTML5 & CSS3 & jQuery Mobile 实现) (英文版) [Packt Publishing] Dreamweaver CS6 Mobile and Web Development with HTML5, CSS3, and jQuery Mobile (E-...
jQuery Mobile开发的移动新闻阅读器,HTML5技术配合jQuery MobilejQuery Mobile jqm 新闻阅读器 jqm图标更换 jQuery Mobile jqm 新闻阅读器 jqm自定义按钮的图片以及header和footer的定位
HTML5+CSS3+jQuery Mobile轻松构造APP与移动网站_陈婉凌.pdf
jquerymobile是用于创建移动 Web 应用的前端开发框架,此资源包含了几套jquerymobile的模板,供新手学习。
本书分为4篇,*篇是移动开发入门篇,介绍了jQuery Mobile、HTML 5和移动开发的一些基础知识,以及如何搭建开发环境;第二篇是jQuery Mobile基础篇,介绍了jQuery Mobile中对话框、工具栏、按钮、表单、布局和插件的...
使用jquery-mobile+html5实现android本地通讯录
jQuery Mobile是一款基于HTML5的用户界面系统,旨在使所有智能手机,平板电脑和桌面设备上都可以访问的响应网站和应用。jQuery Mobile 不仅会给主流移动平台带来jQuery核心库,而且会发布一个完整统一的jQuery移动UI...
jquery mobile 简明 教程 demo 移动 开发 精通 入门 jquery mobile 开发 移动 开发 安卓 手机 开发
本书以HTML与CSS为主,配合jQuery制作网页,并搭配jQuery Mobile制作移动网页,通过具体的范例从基础到高级循序渐进地讲解。全书首先介绍了HTML5网页开发和CSS网页美化,只要按本书的顺序学习,就能够轻松掌握网页...
jQuery Mobile 是用于创建移动 Web 应用的前端开发框架。 jQuery Mobile 可以应用于智能手机与平板电脑。 jQuery Mobile 使用 HTML5 & CSS3 最小的脚本来布局网页。
HTML5+CSS3+jQuery Mobile轻松构造APP与移动网站 陈婉凌编著_清华大学出版社_2015.01_P340_完整版 PDF电子书下载 带书签目录
jquery-mobile 是一套专门用于移动web的开发的ui框架,它构架与jquery 之上,采用html5与css3 的方式布局,适用于所有流行的智能手机和平板电脑。使用jquery-mobile,我们可以写尽量较少的代码来完成想要的页面的效果
1.jQuery Mobile 是一个用于创建移动端web应用的的前端框架。 ...4.通过使用jQuery Mobile 可以 "写更少的代码,做更多的事情" : 它可以通过一个灵活及简单的方式来布局网页,且兼容所有移动设备。
资源名称:jQuery、jQuery UI及jQuery Mobile技巧与示例内容简介:《jQuery、jQuery UI及jQuery Mobile技巧与示例》包括jQuery、jQuery UI、jQuery Mobile以及jQuery插件四部分内容。第一部分介绍jQuery核心库,从...
jQuery&CSS图形下拉菜单jQuery&CSS图形下拉菜单jQuery&CSS图形下拉菜单jQuery&CSS图形下拉菜单jQuery&CSS图形下拉菜单jQuery&CSS图形下拉菜单
jQuery.Mobile的文档以及Demo 还有一个jQuery.Mobile的学习app 可以下载到手机上。
jquery & jquery UI 学习资料
HTML5+jQuery Mobile模板两套
大爱jQuery,10款漂亮实用的jQuery&CSS3插件大爱jQuery,10款漂亮实用的jQuery&CSS3插件
最新的jQuery Mobile 架包,对于利用HTML5技术+jQuery Mobile架包开发移动应用的很有用