《PhoneGap精粹：構建跨平臺的移動App》——1.4節為容器而設計

本節書摘來自非同步社群《PhoneGap精粹：構建跨平臺的移動App》一書中的第1章，第1.4節為容器而設計，作者 【美】John M. Wargo，更多章節內容可以訪問雲棲社群“非同步社群”公眾號檢視

1.4　為容器而設計
PhoneGap精粹：構建跨平臺的移動App
PhoneGap應用程式是一款執行在客戶端的原生應用程式容器中的Web應用程式。正因如此，PhoneGap應用程式中的Web應用程式使用的是HTML5應用程式的結構，而不是傳統的基於服務端Web應用程式的結構。接下來就讓我們看看這個不同的觀點。

1.4.1　傳統的Web伺服器（Web 1.0）方式
對於傳統的Web應用程式，Web伺服器承載著靜態的HTML頁面或者動態頁面，然後將這些頁面返回給客戶端（瀏覽器）。對於動態頁面來說，伺服器端的語言或指令碼語言通常用於（比如從資料庫）獲取動態內容，還用於將這些內容在發回瀏覽器之前格式化為HTML。當瀏覽器發出一個請求時，伺服器會去獲取相應的頁面和內容，然後將這些內容格式化成HTML（或其他類似的，比如XHTML），最後將這些內容發回瀏覽器顯示。

這裡我們假定瀏覽器不需要對內容對任何處理。瀏覽器只是請求頁面，同時為了返回請求的內容伺服器會做許多工作。在瀏覽器上，應用程式可以利用客戶端JavaScript程式碼，讓使用者和頁面上的內容互動，但通常大多數工作會在服務端完成。

1.4.2　Web 2.0方式
隨著Web 2.0的出現，Web伺服器的負載有了一個下降，取而代之的是在瀏覽器中執行
JavaScript程式碼來請求資料和展示資料。Web伺服器向Web應用程式傳送了一個基於HTML的封裝，隨頁面一起傳送過去的JavaScript程式碼會動態組織頁面的內容區域，根據需要顯示或隱藏資料內容。

Web 2.0應用程式之所以會成功主要是因為JavaScript中的XMLHTTPRequest（XHR） API。該API讓web應用程式可以非同步地向伺服器傳送請求，並當從伺服器獲取資料後處理這些資料，而不用打斷使用者的當前操作。許多PhoneGap應用程式都大量使用XHR與遠端伺服器互動。

該方式可以支援更多有趣的Web應用——看起來更像原生桌面應用的應用程式。雖然Web伺服器還是需要用來承載提供給瀏覽器的頁面和內容，但是幾乎不會直接運算元據。Google Maps（http://maps.google.com）或Google Gmail（http://mail.google.com）都是很好的Web 2.0的例子。

1.4.3　HTML5方式
移動裝置需要一個稍微不同的方式。雖然Web 1.0和2.0在智慧機上可以很好地工作，但對Web 1.0的應用來說，在伺服器和裝置間需要傳輸大量的資料。對Web 2.0的應用來說，雖然沒有這方面的問題，但是需要不斷使用網路。Google甚至為了解決這個問題，發明了一項名為Google Gears(http://gears.google.com)的技術，該技術在客戶端提供了一個SQL資料庫和其他一些功能，用來保證即使無法訪問Web伺服器，Web應用程式仍然可以正常工作。但後來，他們停止了這個專案，轉而投入幫助起草HTML5的標準。

通過HTML5，Web應用程式可以使用一些新的功能，這些功能在移動裝置（或受限於網路連線的裝置）上可以更高效地執行。通過HTML5，Web應用程式可以使用客戶端的資料庫去儲存應用程式資料。對移動裝置來說，這使得無論在有網路還是無網路的情況下，操作都會變得更簡單。此外，HTML5還支援使用manifest（宣告）檔案，列出Web應用程式會用到哪些檔案。當載入了Web應用程式的index檔案時，瀏覽器將讀取manifest檔案，並且接收該檔案中列出的所有檔案，並下載到客戶端裝置中。如果移動裝置無法連線到網路，只要manifest檔案中列出的檔案已經儲存在了裝置上，那麼應用程式通過使用本地儲存的資料還是可以繼續工作的。

雖然我們需要為Web應用程式特地編寫程式才能使用這些HTML5的能力，但該Web應用程式可以在瀏覽器容器（或在PhoneGap應用程式容器）中獨立執行。通常，index.html檔案只是應用程式中的HTML檔案，同時該應用程式的不同“螢幕”1實際上只是根據需要移入移出的不同