Mobile web application技术初探
colindoug
http://www.secservice.net/bbs/viewtopic.php?f=9&t=1155&p=1460#p1460
一、概念
所谓Mobile web application是mobile +web + application 三项技术的结合，移动技术即手机等移动设备和无线网络技术是针对固定的PC终端等技术说的，web技术也即B/S架构技术是针对C/S模式的说的，Application是直接运行在操作系统上的应用程序，通常是C/S架构中的Client程序。
Mobile web application 是一种全新的技术，是在 手机等移动设备上的 浏览器中运行的一种 类Client应用程序。
二、Mobile web application的意义何在？
举个例子来说，如果要开发一款手机上的炒股软件，那么因为市面上的手机平台种类很多，又因为这个Client app程序直接运行在操作系统上，于是不得不开发很多个版本，再比如，苹果的应用商店里的程序只能运行在苹果的设备上，这是一种很大的局限性，突破这种局限性的技术一般是通过虚拟机，比如跨平台的java，就是依靠jvm来屏蔽了操作系统的差异，一次编写到处运行，但是在移动平台上，没有一个类似java这样被广泛接受的开放平台。 从目前看趋势上看，手机上一次编写到处运行的技术将是HTML5+CSS+Javascript的技术架构，通过浏览器来屏蔽操作系统的差异，浏览器将演变成为一个虚拟机。web application和web的程序的除了用户体验近似以外，web application也可以是一个本地程序，不一定需要有web server的存在。因为Mobile web application的优越的特性，所以目前各手机厂商的的应用程序商店，都在面临进化。越来越多的手机程序将是用HTML5+CSS+Javascript实现。
三、Mobile web application技术框架
1.jquery mobile，这个2010年8月发起的项目经过1年的发展目前已经发布了jquery mobile beta2.是目前知名度较高（借光jquery），发展较快并且在国内被应用较多的一个框架。
官方主页：：http://jquerymobile.com/
2.jQTouch
是一个基于jQuery 的插件，主要用于手机上的 Webkit 浏览器上实现一些包括动画、列表导航、默认应用样式等各种常见UI效果的JavaScript 库。支持包括 iPhone、Android 等手机。《Building iPhone Apps with HTML, CSS, and JavaScript》书中的例子都是用jQTouch来做的。
在线demo(注意要用IE9或者最新版的safari或者chrome浏览器):http://www.jqtouch.com/preview/demos/main
官方主页：http://www.jqtouch.com/
3.Sencha Touch
基于JavaScript编写的Ajax框架ExtJS,将现有的ExtJS整合JQTouch、Raphal库，推出了适用Touch Web的Sencha Touch框架，该框架号称是世界上第一个基于HTML5的Mobile App框架。同时，ExtJS更名为Sencha，JQTouch的创始人David Kaneda，以及Raphal的创始人也已加盟Sencha团队。
Sencha Touch可以让Web App看起来像Native App。用户界面组件和丰富的数据管理，基于最新的HTML5和CSS3的WEB标准，兼容Android和Apple iOS设备。
下面是Sencha官方给出的几点特性
1.基于最新的WEB标准 – HTML5，CSS3，JavaScript。整个库在压缩和gzip后大约80KB，通过禁用一些组件还会使它更小。
2.支持世界上主流的设备。Beta版兼容Android和iOS，Android上的开发人员还可以使用一些专为Android定制的主题。
3.增强的触摸事件。在touchstart、touchend等标准事件基础上，增加了一组自定义事件数据集成，如tap、swipe、pinch、rotate等。
4.数据集成。提供了强大的数据包，通过Ajax、JSONp、YQL等方式绑定到组件模板，写入本地离线存储。
官方主页：http://www.sencha.com/products/touch/
4.phonegap
是由Nitobi推出的一个开源的HTML 5开发平台，可帮助开发者通过HTML、CSS和JavaScript开发本地移动应用。一次开发，可部署到六大平台：iOS、Android、BlackBerry、webOS、bada和Symbian。2011年7月29日，Nitobi发布了PhoneGap 1.0版产品。phonegap的特点是它将移动设备本身提供的复杂的API进行了抽象和简化，提供了一系列丰富的API供开发者调用，只要你会HTML和JavaScript或者Java语言，就可以利用这个移动开发框架提供的API去调用各种功能，让你可以制作出在各种手机平台上运行的应用。
51cto上有个专题值得看看：http://mobile.51cto.com/hot-273792.htm
官方主页：http://www.phonegap.com/
5.Titanium Mobile
据说和 Sencha Touch有很多类似，但是它会把代码编译成一个本地app在手机上运行，所以有人认为它不是一个真正的web 框架，而是一个编译器。
官方主页： http://www.appcelerator.com/products/ti ... velopment/
四、HTML5和javascript的颠覆性
HTML5的出现一度被认为其替代性会导致adobe的flash消亡，但是，现在看来，远非如此，从各浏览器厂商在javascript引擎上所花的心思和投入，可以看到，javascript的崛起可能会让更多的人感到惊讶。不能不提及google 的一些作为，除了用44万多行javascript重新实现gmail全部功能外，作为推动V8引擎的一大策略，nodejs给大家带来了更宽广遐想的空间， http://nodejs.org/。难道将来的程序甚至云皆是html5+javascript+css+broswer?
其他参考：
wikipedia上的相关词条： http://en.wikipedia.org/wiki/Mobile_Web
W3C上关于Mobile web application开发的最佳实践： http://www.w3.org/TR/mwabp/
colindoug
2011-09-08
colindoug
http://www.secservice.net/bbs/viewtopic.php?f=9&t=1155&p=1460#p1460
一、概念
所谓Mobile web application是mobile +web + application 三项技术的结合，移动技术即手机等移动设备和无线网络技术是针对固定的PC终端等技术说的，web技术也即B/S架构技术是针对C/S模式的说的，Application是直接运行在操作系统上的应用程序，通常是C/S架构中的Client程序。
Mobile web application 是一种全新的技术，是在 手机等移动设备上的 浏览器中运行的一种 类Client应用程序。
二、Mobile web application的意义何在？
举个例子来说，如果要开发一款手机上的炒股软件，那么因为市面上的手机平台种类很多，又因为这个Client app程序直接运行在操作系统上，于是不得不开发很多个版本，再比如，苹果的应用商店里的程序只能运行在苹果的设备上，这是一种很大的局限性，突破这种局限性的技术一般是通过虚拟机，比如跨平台的java，就是依靠jvm来屏蔽了操作系统的差异，一次编写到处运行，但是在移动平台上，没有一个类似java这样被广泛接受的开放平台。 从目前看趋势上看，手机上一次编写到处运行的技术将是HTML5+CSS+Javascript的技术架构，通过浏览器来屏蔽操作系统的差异，浏览器将演变成为一个虚拟机。web application和web的程序的除了用户体验近似以外，web application也可以是一个本地程序，不一定需要有web server的存在。因为Mobile web application的优越的特性，所以目前各手机厂商的的应用程序商店，都在面临进化。越来越多的手机程序将是用HTML5+CSS+Javascript实现。
三、Mobile web application技术框架
1.jquery mobile，这个2010年8月发起的项目经过1年的发展目前已经发布了jquery mobile beta2.是目前知名度较高（借光jquery），发展较快并且在国内被应用较多的一个框架。
官方主页：：http://jquerymobile.com/
2.jQTouch
是一个基于jQuery 的插件，主要用于手机上的 Webkit 浏览器上实现一些包括动画、列表导航、默认应用样式等各种常见UI效果的JavaScript 库。支持包括 iPhone、Android 等手机。《Building iPhone Apps with HTML, CSS, and JavaScript》书中的例子都是用jQTouch来做的。
在线demo(注意要用IE9或者最新版的safari或者chrome浏览器):http://www.jqtouch.com/preview/demos/main
官方主页：http://www.jqtouch.com/
3.Sencha Touch
基于JavaScript编写的Ajax框架ExtJS,将现有的ExtJS整合JQTouch、Raphal库，推出了适用Touch Web的Sencha Touch框架，该框架号称是世界上第一个基于HTML5的Mobile App框架。同时，ExtJS更名为Sencha，JQTouch的创始人David Kaneda，以及Raphal的创始人也已加盟Sencha团队。
Sencha Touch可以让Web App看起来像Native App。用户界面组件和丰富的数据管理，基于最新的HTML5和CSS3的WEB标准，兼容Android和Apple iOS设备。
下面是Sencha官方给出的几点特性
1.基于最新的WEB标准 – HTML5，CSS3，JavaScript。整个库在压缩和gzip后大约80KB，通过禁用一些组件还会使它更小。
2.支持世界上主流的设备。Beta版兼容Android和iOS，Android上的开发人员还可以使用一些专为Android定制的主题。
3.增强的触摸事件。在touchstart、touchend等标准事件基础上，增加了一组自定义事件数据集成，如tap、swipe、pinch、rotate等。
4.数据集成。提供了强大的数据包，通过Ajax、JSONp、YQL等方式绑定到组件模板，写入本地离线存储。
官方主页：http://www.sencha.com/products/touch/
4.phonegap
是由Nitobi推出的一个开源的HTML 5开发平台，可帮助开发者通过HTML、CSS和JavaScript开发本地移动应用。一次开发，可部署到六大平台：iOS、Android、BlackBerry、webOS、bada和Symbian。2011年7月29日，Nitobi发布了PhoneGap 1.0版产品。phonegap的特点是它将移动设备本身提供的复杂的API进行了抽象和简化，提供了一系列丰富的API供开发者调用，只要你会HTML和JavaScript或者Java语言，就可以利用这个移动开发框架提供的API去调用各种功能，让你可以制作出在各种手机平台上运行的应用。
51cto上有个专题值得看看：http://mobile.51cto.com/hot-273792.htm
官方主页：http://www.phonegap.com/
5.Titanium Mobile
据说和 Sencha Touch有很多类似，但是它会把代码编译成一个本地app在手机上运行，所以有人认为它不是一个真正的web 框架，而是一个编译器。
官方主页： http://www.appcelerator.com/products/ti ... velopment/
四、HTML5和javascript的颠覆性
HTML5的出现一度被认为其替代性会导致adobe的flash消亡，但是，现在看来，远非如此，从各浏览器厂商在javascript引擎上所花的心思和投入，可以看到，javascript的崛起可能会让更多的人感到惊讶。不能不提及google 的一些作为，除了用44万多行javascript重新实现gmail全部功能外，作为推动V8引擎的一大策略，nodejs给大家带来了更宽广遐想的空间， http://nodejs.org/。难道将来的程序甚至云皆是html5+javascript+css+broswer?
其他参考：
wikipedia上的相关词条： http://en.wikipedia.org/wiki/Mobile_Web
W3C上关于Mobile web application开发的最佳实践： http://www.w3.org/TR/mwabp/
colindoug
2011-09-08
383
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
