《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與遠端伺服器互動。

1.4.3　html5方式

通過html5，web應用程式可以使用一些新的功能，這些功能在移動裝置（或受限于網絡連接配接的裝置）上可以更高效地運作。通過html5，web應用程式可以使用用戶端的資料庫去儲存應用程式資料。對移動裝置來說，這使得無論在有網絡還是無網絡的情況下，操作都會變得更簡單。此外，html5還支援使用manifest（聲明）檔案，列出web應用程式會用到哪些檔案。當加載了web應用程式的index檔案時，浏覽器将讀取manifest檔案，并且接收該檔案中列出的所有檔案，并下載下傳到用戶端裝置中。如果移動裝置無法連接配接到網絡，隻要manifest檔案中列出的檔案已經儲存在了裝置上，那麼應用程式通過使用本地儲存的資料還是可以繼續工作的。

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

容器。html5應用程式仍然需要向伺服器請求所需的資料，你可以通過使用xhr異步地請求資料并根據需要儲存在本地。

web開發人員必須反複思考利用這些html5能力的web開發方式。html5應用程式在移動裝置上應該是可以自給自足2的，而不是向web伺服器請求各種資訊。

運作在phonegap應用程式中的web應用程式就是一個html5應用程式。

1譯者注：指不同的顯示界面。

2譯者注：指不需要依賴web伺服器也可以獨立運作。