火熱的H5手機開發(fā)一

時間：2023-05-24 13:15:02 | 來源：網(wǎng)站運營

時間：2023-05-24 13:15:02 來源：網(wǎng)站運營

火熱的H5手機開發(fā)一：

一、H5 的含義

表面上看，手機 App 都是同樣的東西，就是手機上的應用程序，點擊圖標就能運行，但是它們的底層技術不一樣。按照開發(fā)技術，App 可以分成三大類。

• 原生應用（native application，簡稱 native App）
• Web 應用（web application，簡稱 Web App）
• 混合應用（hybrid application，簡稱 hybrid App）

這三類 App 的技術模型都不一樣，各有優(yōu)缺點。企業(yè)一般會選擇其中一種作為主要技術棧，構建自己的手機 App。







H5 這個詞，可以理解成就是混合 App 模型，只不過它特指混合 App 的前端部分。 因為混合 App 的前端就是 HTML5 網(wǎng)頁，所以簡稱 H5。這個詞是國內(nèi)獨有的，基本上都是前端程序員在用，國外不用這個詞，就直接叫混合 App。

真正理解 H5 開發(fā)，需要先搞清楚什么是原生 App、什么是 Web App，因為混合 App 是在它們的基礎上誕生的。

二、原生應用

2.1 概念

原生 App 是專門為特定手機平臺開發(fā)的應用程序 ，無法在其他平臺運行。一個手機軟件如果要同時支持蘋果手機和安卓手機，就需要為它們各寫一個原生 App。

歷史上，原生 App 最早出現(xiàn)，跟智能手機系統(tǒng)一起誕生。2007年6月 iPhone 誕生，2008年9月安卓誕生，就同時發(fā)布了自家平臺的原生 App 開發(fā)方法。

原生 App 使用與手機操作系統(tǒng)相同的語言。iOS 的原生 App 使用 Objective-C 語言或 Swift 語言，安卓使用 Java 語言或 Kotlin 語言。由于跟底層系統(tǒng)的語言和技術模型一致，所以原生 App 的性能和用戶體驗都很好。

2.2 優(yōu)點

原生 App 的優(yōu)點主要是兩個：（1）較好的性能和體驗；（2）可以使用系統(tǒng)的所有硬件和軟件 API，比如 GPS、攝像頭、麥克風、加速計、通知推送等等，能充分發(fā)揮系統(tǒng)的潛力。

2.3 缺點

原生 App 的缺點主要是成本，每個手機平臺都要建立一個獨立的開發(fā)團隊，大公司一般都有 iOS 和安卓兩個開發(fā)團隊。如果出現(xiàn)第三個平臺（以前的 Windows Phone，也許將來的華為鴻蒙 OS），就要組建第三個團隊，成本就更高。

第二個缺點是，原生 App 使用底層操作系統(tǒng)的語言，都是很重的編譯型語言，開發(fā)和調(diào)試成本相對較高，時間周期長。

第三個缺點是，原生 App 必須下載安裝才能使用，只要升級版本，就必須重新下載安裝。用戶往往不愿意更新版本，廠商被迫不得不長期支持很久以前的舊版本。

三、Web 應用

3.1 概念

Web App 是使用網(wǎng)頁做的應用程序，必須在瀏覽器中使用。 比如，你在瀏覽器中收發(fā)郵件，就是在使用 Web App。

Web App 主要使用網(wǎng)頁技術，即 HTML、JavaScript 和 CSS。2008年，w3c 組織發(fā)布了 HTML 第5版，簡稱 HTML 5，該版本大大增強了網(wǎng)頁的功能，使得網(wǎng)頁可以當作應用程序使用，而不僅僅是展示文字和圖片，這就是 Web App 的由來。

3.2 優(yōu)點和缺點

Web App 的優(yōu)點是：（1）不需要下載安裝，打開瀏覽器就能使用，而且總是使用最新版本；（2）對于開發(fā)者來說，Web App 寫起來比較快，調(diào)試容易，不需要應用商店的批準就能發(fā)布。

Web App 的主要缺點有兩個。首先，瀏覽器提供的 API（即 Web API）很有限（目前只有相機、GPS、電池等少數(shù)幾個），大部分系統(tǒng)硬件都不能通過網(wǎng)頁訪問，也無法直接讀取硬盤文件，所以 Web App 無法充分利用平臺的硬件。

第二個缺點是，網(wǎng)頁通過瀏覽器渲染，性能不如原生 App，不適合做性能要求較高的頁面。

3.3 Web App 的劣勢

Web App 需要打開瀏覽器才能使用，這意味著，用戶必須記住如何導航到它，要么直接輸入網(wǎng)址，要么翻找書簽。這使得進入 Web App，遠不如原生 App 方便。這點很致命，事實表明，用戶偏好原生 App。

谷歌曾經(jīng)調(diào)查了原生 App 和 Web App 各一千個，發(fā)現(xiàn) Web App 可以覆蓋更多的用戶（1100萬 vs 400萬），但是原生 App 的用戶使用時間（188分鐘）遠超 Web App（9分鐘）。













另一項調(diào)查發(fā)現(xiàn)，用戶87％的時間用在原生 App，13％的時間用在 Web App。由于這個原因，企業(yè)很少開發(fā) Web App，都把原生 App 當作首選。

但是，Web App 也不是毫無競爭力。根據(jù)調(diào)查，普通用戶每月平均使用27個原生 App，但訪問了100多個手機網(wǎng)站。這意味著，用戶的 App 使用時間都被頭部 App 占據(jù)了，小公司的 App 使用頻率非常低，獲客成本極高，最終變成僵尸 App。因此，小公司開發(fā) Web App 更劃算，不僅成本低，而且可以服務更多的用戶，以及更好地宣傳自己（可以被搜索引擎收入）。

3.4 PWA

為了推廣 Web App，谷歌公司的 Chrome 瀏覽器團隊做了很多努力。他們認為，Web App 足以滿足大多數(shù) App 的需求，但是三大缺陷阻礙它的推廣。

1. 不能從手機的首屏直接進入。
2. 缺乏手機狀態(tài)欄和鎖屏時的通知推送能力。
3. 不支持脫機訪問（即斷網(wǎng)也能使用）。

為了解決這些問題，Chrome 團隊開發(fā)了新技術"漸進式 Web App"（Progressive Web App，縮寫 PWA）。它可以把網(wǎng)站緩存在手機里面，供離線時使用，還能在手機首屏生成圖標，直接點擊進入，并且有通知推送能力，也不帶有瀏覽器的地址欄和狀態(tài)欄，跟原生 App 的使用體驗非常接近。

但是，PWA 需要瀏覽器訪問一次網(wǎng)站，才能在首屏生成圖標，并且目前 iOS 系統(tǒng)的支持還不夠理想，所以還只是一項探索性質(zhì)的技術，迄今為止缺乏足夠的成功案例。