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應用程序的相關知識。