APP開發模式
目前市場上主流的APP分為三種：
1.原生APP
2.Web APP（即HTML5）
3.混合APP 當然，還有flutter等
APP開發模式對比
1. 原生開發
原生開發（Native App開發），是在Android、IOS等移動平台上利用官方提供的開發語言、開發類庫、開發工具進行App開發。比如Android是利用Java、Eclipse、Android studio；IOS是利用Objective-C 和Xcode進行開發。
優點：
- 可通路手機所有功能（如GPS、攝像頭等）、可實作功能最齊全；
- 運作速度快、性能高，絕佳的使用者體驗；
- 支援大量圖形和動畫，不卡頓，反應快；
- 相容性高，每個代碼都經過程式員精心設計，一般不會出現閃退的情況，還能防止病毒和漏洞的出現；
- 比較快捷地使用裝置端提供的接口，處理速度上有優勢。
缺點：
- 開發時間長，快則3個月左右完成，慢則五個月左右；
- 制作費用高昂，成本較高；
- 可移植性比較差，一款原生的App，Android和IOS都要各自開發，同樣的邏輯、界面要寫兩套；
- 内容限制（App Store限制）；
- 必須等下載下傳完畢使用者才可以打開，獲得新版本時需重新下載下傳應用更新。
- 新需求疊代，上線慢。
2. web APP (h5開發)
HTML5應用開發，是利用Web技術進行的App開發，可以在手機端浏覽器裡面打開的網站就稱之為webapp。Web技術本身需要浏覽器的支援才能進行展示和使用者互動，是以主要用到的技術是HTML、CSS、Javascript以及jQuery、Vue、React等JS架構。
優點：
1.支援裝置範圍廣，可以跨平台，編寫的代碼可以同時在Android、IOS、- 2.Windows上運作；
3.開發成本低、周期短；
4.無内容限制；
5.适合展示有大段文字（如新聞、攻略等），且格式比較豐富（如加粗，字型多樣）的頁面；
6.使用者可以直接使用最新版本（自動更新，不需使用者手動更新）。
缺點：
1.由于Web技術本身的限制，H5移動應用不能直接通路裝置硬體和離線存儲，是以在體驗和性能上有很大的局限性；
2.對聯網要求高，離線不能做任何操作；
3.功能有限；
4.APP反應速度慢，頁面切換流暢性較差；
5.圖檔和動畫支援性不高；
6.使用者體驗感較差；
7.無法調用手機硬體（攝像頭、麥克風等）。
混合（原生+H5）開發 - Hybrid App開發
混合開發（Hybrid App開發），是指在開發一款App産品的時候，為了提高效率、節省成本而利用原生與H5的開發技術的混合應用。通俗點來說，這就是網頁的模式，通常由“HTML5雲網站+APP應用用戶端”兩部份構成。
混合開發是一種取長補短的開發模式，原生代碼部分利用WebView插件或者其它架構為H5提供容器，程式主要的業務實作、界面展示都是利用與H5相關的Web技術進行實作的。比如京東、淘寶、今日頭條等APP都是利用混合開發模式而成的。
優點：
1.開發效率高，節約時間。同一套代碼Android和IOS基本上都可使用；
2.更新和部署比較友善，每次更新版本隻需要在伺服器端更新即可，不再需3.要上傳到App Store進行稽核；
3.代碼維護友善、版本更新快，節省産品成本；
4.比web版實作功能多；
5.可離線運作。
缺點：
1.功能/界面無法自定：所有内容都是固定的，不能換界面或增加功能；
2.加載緩慢/網絡要求高：混合APP資料需要全部從伺服器調取，每個頁面都需要重新下載下傳，是以打開速度慢，網絡占用高，緩沖時間長，容易讓使用者反感；
3.安全性比較低：代碼都是以前的老代碼，不能很好地相容最新手機系統，且安全性較低，網絡發展這麼快，病毒這麼多，如果不實時更新，定期檢查，容易産生漏洞，造成直接經濟損失；
目前混合開發有兩種開發模式：
1.原生主導的開發模式：需要安卓和IOS原生開發人員，整個App既有原生開發的頁面，也有H5頁面，在需要H5頁面時由原生開發工程師實作内嵌，筆者最近正在開發的項目就使用這種開發模式。
2.H5主導的開發模式：隻需要H5開發工程師，借助一些封裝好的工具實作應用的打包與調用原生裝置的功能，如HBuilder的雲端打包功能。
混合開發APP中如何辨識原生和H5
上圖中是上半部分是原生，下半部分是H5
1. 看加載的方式 - (比較準确)
如果在打開新頁面導航欄下面有一條加載的線的話，這個頁面就是H5頁面，如果沒有就是原生的。 微信裡面打開我們的H5頁面常見的有個綠色的加載線條。
比如國美APP中打開是紅色的進度條
2. 看app頂部 導航欄是否會有關閉的操作- (不太準确)
如果APP頂部導航欄當中出現了關閉按鈕或者有關閉的圖示，那麼目前的頁面肯定的H5，原生的不會出現（除非設計開發者故意弄的）
美團的、大衆點評的APP、微信APP當加載h5過多的時候，左上角會出現關閉二字
3. 看布局邊界（隻适用于安卓手機）
可以打開 開發者選項中的顯示布局邊界，頁面元素很多的情況下布局是一整塊的是h5的，布局密密麻麻的是原生控件。頁面有布局的是原生的否則為h5頁面。（僅針對安卓手機試用）
4. 看複制文章的提示，需要你通過對比才能得出結果。（不準确）
比如是文章資訊頁面可以長按頁面試試，如果出現文字選擇、粘貼功能的是H5頁面，否則是native原生的頁面。 有些原生APP開放了複制粘貼功能或者關閉了。而H5的css屏蔽了複制選擇功能等等情況。需要通過對目标測試APP進行對比才可知。
5. 看斷網的情況
把手機的網絡斷掉。然後點開頁面。然後可以正常顯示的東西就是原生寫的。 顯示404或者錯誤頁面的是html頁面。原生部分頁面是可以正常打開的，打不開的原生和H5的報錯也是有差別的。
6. 判斷頁面 下拉重新整理的時候（前提是要有下拉重新整理的功能）
如果界面沒有明顯重新整理現象的是原生的，如果有明顯重新整理現象（比如閃一下）的是H5頁面（ios和android）。 比如淘寶的衆籌頁面。
7. 下拉頁面的時候顯示網址提供方的一定是H5
文章摘自：
- segmentfault.com/a/119000002…
總結
目前，多數混合開發的前端技術棧，選型vue, react的比較多，國外的話angular比較多，國内較少，存在招人難的問題。
1.純H5的應用，是體驗最差的
2.hybird應用中，webview方式嵌入H5的方式目前大廠和中小企業用的較多。
3.Flutter是一款移動應用程式SDK，一份代碼可以同時生成iOS和Android兩個高性能、高保真的應用程式。目前，不少中小型企業已經開始大量使用。
4.weex目前沒有在項目中使用過，了解到使用它的産品不多
r5.n 目前在京東有少量使用。
思考
1.我們的APP，如何選擇适合自己團隊的技術架構，使我們的APP疊代更快，體驗更好，這是我們一直在追求的。目前，國内vue，react，從生态，元件庫，全家桶各個方面，都已經非常成熟。如果你是一個比較喜歡嘗試新的東西，建議可以搞一下flutter。考慮項目的穩定發展建議還是以vue，react為主。
2.據我了解，RN的開發投入，人力，幾乎接近于原生。目前我們團隊不考慮