最早的App開發只有原生這個概念，Html頁面只是用來做一些簡單的靜態資源展示，但是隨著H5的興盛，大家發現很多功能、邏輯都可用web來實現，然後原生作為容器顯示，而且H5展示的頁面更炫酷、功能更豐富，在IOS、Andriod中都有很好的支持，這樣開發效率更高、成本更低，同時用戶體驗也不錯。目前市場上主流的APP主要分為三種：原生APP、WebAPP（HTML5）和混合APP三種，相對應的開發模式就是：原生開發、H5開發和混合開發，這裡分別從三者的特點以及優劣性詳細展開，進行對比分析。
三種主流APP
原生APP（NativeAPP）
原生APP就是利用Android、iOS平臺官方的開發語言、開發類庫、工具進行開發。比如安卓的Java、Eclipse、Android studio，iOS的Swift、Objective-C 和Xcode。原生App在應用性能和交互體驗上應該是最好的，該模式通常是由“雲服務器數據+APP應用客戶端”兩部份構成，APP應用所有的UI元素、數據內容、邏輯框架均安裝在手機終端上。用戶只能通過App Store和應用商店下載到，每一種移動操作系統都需要獨立的開發項目。一般用於開發純工具類App，無需頻繁更新的應用程序，例如微信客戶端、一些管理應用。
優點：
- 可訪問手機所有功能，擁有手機的各種功能的權限，調用原生設備，比如獲取個人信息，攝像頭以及重力加速器、GPS等等；
- 功能齊全、運行速度快、性能高、穩定性強，是三種App中用戶體驗最好的；
- 支持大量圖形和動畫，運行不卡頓，系統響應速度快，流暢度好；
- 頁面佈局、功能實現、邏輯步驟都是用代碼實現的，與系統的兼容性好，安全性高，閃退的現象少。
- 支持容易發現（在App Store裡面）和重新發現（應用圖標會一直在手機主頁上），用戶粘度高；
- 比較快捷地使用設備端提供的接口，處理速度上有優勢；
- 官方提供大量的開發工具和人工支持來幫助開發；
- 不需要瀏覽器直接下載獨立的應用在設備上運行，安裝之後使用方便；
- 手機用戶無法聯網時也可以訪問APP應用中以前加載好的數據
- 可以通過用戶下載應用盈利（但App Store抽取20-30% 的營收）
缺點：
- 開發語言相對web前端學習難度大，原生人員的入門門檻高，Android，iOS都需要獨立學習，Android基於Java語言，底層調用Google的 API；iOS基於OC或者Swift語言，底層調用App官方提供的API。
- 開發成本高、項目週期長，需要配備兩個專門的開發人員，對應開發Android和IOS兩套獨立的代碼，不能跨平臺開發，且支持的設備有限，可移植性差；
- App需要發佈到應用市場接受審核，內容根據不同平臺的規定受到限制，審核標準嚴格、週期長，需要具備企業證書。
- 應用安裝包大，包含UI元素、數據內容、邏輯框架，佔用用戶手機內存資源。
- APP應用每次更新、維護，都要涉及到向各個應用商店提交審核，上傳發布到應用市場，用戶在App Store或者應用市場裡進行更新，重新下載安裝新的包，必須等下載安裝完畢才可以打開使用，用戶可以對App進行點評、投訴。
Web版APP（HTML 5）
可以在手機端瀏覽器裡面打開的網站就是Web App，是利用Web技術進行的App開發，本質就是瀏覽器功能的疊加，用普通Web開發語言開發的，通過瀏覽器運行。Web技術本身需要瀏覽器的支持才能進行展示和用戶交互，因此主要用到的技術是HTML5、JavaScript、CSS等。適合展示有大段文字、圖片排版，且樣式比較豐富的頁面，很多通過vue和react框架編寫的都是WebApp。
優勢：
- 開發成本低、週期短，只需要H5前端工程師開發一套代碼，就可以同時在Android、IOS、Windows等設備上運行，支持設備範圍廣，兼容多種設備，可以跨平臺開發，開發完成後可以即時上線，市面上有大量的開發框架可以幫助開發人員縮短開發週期和開發難度；
- 由於不用上架應用市場，所以內容沒有限制；
- 無需安裝App，不會佔用用戶手機內存，用戶直接通過瀏覽器即可訪問。這是它的優點，同時也是它的缺點，用戶用完即走，留存率低。
- 維護簡單，不需要用戶下載安裝，只需要瀏覽器的解析，通過瀏覽器可以直接訪問；
- 開發者更新僅需要通過服務器更新即可，用戶能夠直接使用最新版本號（自己主動更新，不需用戶手動更新），對用戶來說是感覺不到更新操作的，實現了無痕更新（需要注意一下瀏覽器緩存的問題）。
缺點：
- 對網絡依賴性強，一旦沒有網絡就無法進行任何操作，耗費流量，網速慢的時候影響訪問速度；
- 由於Web技術本身的限制，可以使用的功能有限，並不能直接訪問手機的所有功能，很多權限受到限制，比如攝像頭麥克風、、GPS，重力加速器、離線存儲等，所以在體驗和性能上有很大的侷限性；
- App運行速度慢，頁面不能承載太多東西，切換的時候流暢性較差；
- 和原生App相比，性能和用戶體驗都大打折扣，圖片和動畫支持性不高，穩定性不強；
- 如果用戶使用更多的新型瀏覽器，那麼就會出現運行問題；
- 因為不通過App store下載，所以無法通過下載盈利。
混合APP（HybridAPP）
混合App是原生應用和Web應用的結合體，在開發的時候，不僅利用了原生APP的開發技術還應用了HTML5開發技術，所以必須在部分在設備上執行、部分在Web上執行，二者混合比例不限。通俗點來說，這就是網頁的模式，通常由“HTML5雲網站+APP應用客戶端”兩部份構成。
混合開發是一種取長補短的開發模式，原生代碼部分利用Web View插件或者其它框架為H5提供容器（Android中是webview,iOS7以下有UIWebview,7以上有WKWebview），嵌套Html 5 頁面。程序主要的業務實現、界面展示都是利用與H5相關的Web技術進行實現的。
優點：
- 開發效率高、週期短，一套代碼可以兼容Android、IOS、普通webkit瀏覽器設備，可以跨平臺開發，可複用性非常高；
- 可以在App Store下載，部分內容可離線運行；
- 可以訪問手機的功能要比Web版App更多，但是依然比不上原生的App；
- 代碼更新和維護比較方便，版本升級的時候只需在服務端升級即可，不需要上傳App Store審核；
缺點：
- 用戶體驗不如本地原生App應用；
- 加載速度慢，網絡要求高；
- 技術還不是很成熟，安全性較差。
總結
分析完了以上三種開發模式，它們各有利弊，那麼在實際開發中，我們到底應該如何選擇？具體還是需要看團隊的產品需求，綜合項目預算，上線時間，產品功能等幾個方面來考慮。
- 假如預算充足，性能要求高，開發週期長，可以考慮用戶體驗比較好的原生App。
- 假如產品需要短時間內上線，兼容所有平臺，不追求用戶體驗和性能，沒有離線訪問的需求，可以選擇Web App。
- 追求性能、體驗，同時追求開發效率，有部分功能需要調用攝影頭、麥克風、GPS定位等手機原生功能，則推薦使用混合App。
混合App綜合了兩種App的優點，但是目前在性能上依舊有所欠缺，並不是說混合App就是最好解決方案。根據實際需要來做選擇是正確的做法，適合的才是最好的，當然如果條件允許的話，原生加Web兩種版本一起開發更好。
我自己是一名從事了多年的前端老程序員，小編為大家準備了新出的前端編程學習資料，免費分享給大家！
如果你也想學習前端，那麼幫忙轉發一下然後再關注小編後私信【1】可以得到我整理的這些前端資料了（私信方法：點擊我頭像進我主頁有個上面有個私信按鈕）
閱讀更多 前端明澈 的文章
