1.5 关于移动Web应用

各种类型的移动应用程序种类繁多，其开发的方式也存在着差异，有些采用原生SDK进行开发，有些是基于Web的应用开发，不同的开发方式各有优缺点。本节将向读者介绍有关移动Web应用开发的相关基础知识，使读者对移动Web应用有更深入的了解。

1.5.1 移动Web应用的发展

自2007年Apple公司发布第一款iPhone手机之后，基于移动终端的Web应用便得到发展。当时Apple公司并不允许第三方开发者开发其iPhone应用软件，只允许他们开发基于Web的应用程序。

2008年，Apple正式推出iPhone SDK，并开放APP Store应用软件市场。SDK的推出，让原来需要开发基于Web应用的第三方开发者几乎都转向iPhone SDK的开发。

现在，移动智能设备之所以能够风靡全球，除了因其具有强大的硬件特性外，更重要的是它们拥有海量的应用软件，特别是在APP Store和Android Market上的应用都是基于两大公司（Apple和Google）提供SDK给第三方开发者进行开发的。Apple公司提供的是基于Object-C语言的iOS SDK应用开发，Google公司提供的是基于Java语言的Android SDK应用开发。

基于原生SDK的开发存在以下几点优势。

（1）更好的用户体验和交互操作。

（2）不受网络限制，节省带宽成本。

（3）可以充分发挥设备硬件和操作系统的特性。

原生SDK在开发应用软件方面的优势非常明显，但仍存在一些不足，如下。

（1）平台间移植困难，存在版本间的兼容问题。

（2）开发周期长，维护成本高，调试困难。

（3）需要依赖第三方应用商店的审核上架，如APP Store。

1.5.2 基于Web的应用开发

除了基于SDK开发方式外，移动智能设备还支持Web开发方式。例如，iPhone上的APP Store就是典型的Web APP应用软件。尤其是HTML5和Webkit的不断发展，让移动Web应用变得更加强大。

与原生SDK开发相比，基于Web的应用开发存在以下几点优势。

（1）开发效率高，成本低。

（2）跨平台应用，界面风格统一。

（3）调试和发布方便。

（4）无须安装或更新。

基于Web的开发方式虽然在跨平台方面有优势，但并不是所有原生SDK都适合通过Web方式实现，还存在如下3点问题。

（1）无法发挥本地硬件和操作系统的优势。

（2）受网络环境的限制。

（3）难以实现复杂的用户界面效果。

将原生SDK应用和基于Web应用进行比较来看，两种开发模式各有其优点。目前来看，原生SDK应用能发挥出智能手机特性的最大效果，而基于Web应用则更适合一些传统的Web站点建立移动Web版本。

1.5.3 基于HTML5的移动应用

基于Webkit内核的浏览器的一个最大特点就是支持HTML5和CSS3标准。基于HTML5、CSS3和JavaScript的移动应用程序将会是未来的趋势。

1. canvas绘图

HTML5标准最大的变化就是支持Web绘图功能。canvas绘图功能非常强大，可以实现如图形绘制、路径绘制、变形和像素绘图等。用户可以通过获取HTML中DOM元素canvas，并调用其渲染上下文的context对象，使用JavaScript进行图形绘制。

2. 多媒体

Apple的iOS系统默认并不支持播放Flash文件。HTML5的多媒体标准就是Apple公司的最佳解决方案，因为它不需要任何插件，只需要几个页面标签就能实现多媒体的播放。

HTML5标准中的多媒体，Video视频和Audio音频正好弥补了多年来需要插件才能播放Flash的缺陷。现在只需要利用Video元素和Audio通过简单几行页面代码，就能播放互联网上的各种视频和音频文件。

但是，目前各浏览器厂商对多媒体标准所支持的播放格式不一致，如Google的Chrome浏览器支持的多媒体视频格式是Ogg、MPEG4和WebM，而Apple的Safari浏览器则只支持MPEG4。

3. 本地存储

为了满足本地存储数据的需要，HTML5标准中新增两种存储机制，Web Storage和Web SQL数据库。前者通过提供“键/值”方式存储数据，后者通过类似关系数据库的形式存储数据。

4. 离线应用

HTML5标准规范提供一种离线应用的功能。当支持离线应用的浏览器检测到清单文件（Manifest File）中的任何资源文件时，便会下载对应的资源文件，将它们缓存到本地，同时它也保证本地资源文件的版本和服务器上的版本保持一致。

对于移动设备来说，当无网络状态可用时，Web浏览器便会自动切换到离线状态，并读取本地资源以保证Web应用程序继续可用。

5. 使用地理位置

很多现代浏览器中都实了一种神奇的功能，它能够实时获取到用户当前在地图上所在的位置。

虽然地理定位标准严格上来说并不属于HTML5标准规范的一部分，但它已经逐渐得到大部分浏览器的支持。

1.5.4 移动应用开发框架

因为了有Webkit和HTML5的支持，越来越多的Web开发者开始研究基于移动平台的Web应用框架，如基于jQuery页面架构的jQuery Mobile、基于ExtJS架构的Sencha Touch，以及能打通Web和Native两者之间通道的PhoneGap框架。

目前基于HTML5移动Web框架存在两种不同的开发模式，一种是基于传统Web的开发，另一种是基于组件式的Web开发。

基于传统Web的开发模式，就是在传统Web网站上，根据移动设备平台的特点展示其移动版的Web站点。目前最能体现该开发模式优势的Web框架是jQuery Mobile。通过使用CSS3的新特性，Media Queries模块可以实现在一个站点同时能自适应任何设备，包括桌面电脑和智能手机。

基于组件式的Web开发有些类似于Ext所提供的富客户端开发模式，在该模式下几乎所有的组件或视图都封装在JavaScript内，然后通过调用这些组件展示Web应用。这种模式的最佳代表是Sencha Touch。

在本书中将会为读者介绍使用jQuery Mobile移动Web应用框架来开发移动设备Web应用程序的相关知识。