Hybrid App中原生頁面 VS H5頁面

來源：http://www.jianshu.com/p/00ff5664e000

【原文豐富，請看原文】

 

現有3類主流APP，分別爲：Web App、Hybrid App（混合模式移動應用，Hybrid有「混合的」意思）、 Native App（原生app，後面都用「原生app」來描述）。Web App和原生app有不少大牛們都作過比較詳細的比較以及優劣勢分析，我主要對Hybrid App來簡要分析下，談談Hybrid App裏原生頁面和H5頁面的比較和分析。

Hybrid APP指的是半原生半Web的混合類App。須要下載安裝，看上去相似Native App，但只有不多的UI Web View，訪問的內容是 Web 。

如今很多app已經使用H5頁面來代替原生頁面（即Hybrid APP），兩種方式具備不一樣的用戶體驗。恰好最近遇到公司想用H5頁面來代替原生頁面，瞭解了下，並把全部的問題以及知識點都記錄下來。

 

其各自的優劣勢也有不少前輩都已經總結過了，我稍微記錄並概括下（本文中的相對/相比較都是針對這兩種方式而言的）。

原生頁面優點：（1）運行速度比較快（2）能使用設備的底層功能，如攝像頭、方向傳感器、重力傳感器、撥號、GPS、語音、短信、藍牙等（3）在界面設計、功能模塊、操做邏輯等層面相較web更易作到App的便捷性和溫馨性，功能更增強大（4）節省流量

劣勢：（1）不一樣的操做系統（如Android和iOS）須要獨立的進行開發，使用其各自的開發包、開發工具和控件（2）每次有更新，都須要從新打包一次發佈到應用平臺上，且每次要向各個應用商店進行提交審覈。以後用戶須要手動進行點擊更新安裝（安裝成本較高）（3）開發成本比較高，尤爲須要適配各類機型時（如Android應用，須要適配各類Android手機）

H5頁面優點：（1）因爲是運行在瀏覽器上，因此只須要開發一次即可以在不一樣的操做系統上顯示（2）迭代版本時，不須要打包即可以發佈（實時更新、快速迭代），與雲端實現實時數據交互（3）開發成本相對較低，對瀏覽器的適配較簡單，且發佈門檻相對較低

劣勢：（1）每次打開頁面，都得從新加載，獲取數據...（2）過於依賴網絡，速度沒法保證。特別在弱網環境下，不只耗費流量並且加載緩慢，就算是WiFi狀況下也不容樂觀（3）只能使用有限的設備底層功能（沒法使用攝像頭、方向傳感器、重力傳感器、撥號、GPS、語音、短信、藍牙等功能）（4）仍處於發展階段，部分功能沒法在基於現有技術的瀏覽器基礎上實現，且沒法全面的顯示最完美的用戶體驗，只能用現有技術去彌去找最佳解決方案