Native App

傳統(tǒng)的App開發(fā)模式，有iOS和aOS兩大系統(tǒng)，需要各自語言開發(fā)各自的App。 有較好的性能和體驗(yàn)，但是開發(fā)成本和發(fā)布成本都很高。最好的例子是：網(wǎng)易管家App（Tab1 Tab2）。

Web App

移動(dòng)端的網(wǎng)站，常常被稱為H5應(yīng)用，其實(shí)就是運(yùn)行在特定的移動(dòng)端瀏覽器上的網(wǎng)站應(yīng)用。一般泛指 SPA(Single Page Application)模式開發(fā)出的網(wǎng)站，與MPA（Multi-page Application）對應(yīng)。 開發(fā)成本和發(fā)布成本都很低，但是性能和體驗(yàn)雖然不是最差的，但是也受到瀏覽器處理能力的限制，多次下載一樣會(huì)占用用的流量。同樣的例子也是：網(wǎng)易管家APP（Tab3）。

Hybrid App

混合模式的移動(dòng)應(yīng)用，介于Web App、Native App這兩者之間的App開發(fā)技術(shù)，兼具“Native App良好交互體驗(yàn)的優(yōu)勢”和“Web App跨平臺(tái)開發(fā)的優(yōu)勢”，其實(shí)主要的原理是，由Native通過JSBridge等方法提供統(tǒng)一的API，然后用Html Css實(shí)現(xiàn)界面，JS來寫邏輯，調(diào)用API，最終的頁面在Webview中顯示，這種模式下，Android、iOS的API一般有一致性，Hybrid App所以有跨平臺(tái)效果。 開發(fā)和發(fā)布都很方便，效率也是介于Native App模式和Web App模式之間的，但是需要學(xué)習(xí)的范圍比較廣泛，而且需要原生配合。最好的例子：我愛我家App，東方航空App。

React Native App

Facebook發(fā)現(xiàn)Hybrid App存在很多缺陷和不足，于是發(fā)起開源的一套新的App開發(fā)方案React Native。使用JSX語言寫原生界面，js通過JSBridge調(diào)用原生API渲染UI交互通信。 效率體驗(yàn)非常接近Native App，而且發(fā)布和開發(fā)成本低于Native App，但是學(xué)習(xí)需要一定的成本，而且學(xué)習(xí)文檔較少，很容易踩坑。最好的例子：Facebook、Youtube、Discord、QQ、百度等等。

Weex App

阿里巴巴開發(fā)團(tuán)隊(duì)在React Native的成功案例上，重新設(shè)計(jì)出的一套開發(fā)模式，等于是站在了巨人肩膀上并有淘寶團(tuán)隊(duì)項(xiàng)目做養(yǎng)料，廣受關(guān)注，2016年4月正式開源，并在v2.0版本官方支持Vue.js，與React Native分庭抗禮。

單頁開發(fā)模式效率非常高，熱更新發(fā)包體積小，并且跨平臺(tái)性更強(qiáng)。但是由于是剛剛起步，文檔并不全面，而且社區(qū)活躍度也沒有React Native高，功能尚不健全，暫時(shí)不適合完全適用Weex開發(fā)App。 當(dāng)然啦最好的例子肯定是馬爸爸旗下的淘寶、天貓、阿里云、優(yōu)酷、閑魚、餓了么等等。

深度解析

Native App

Native App是一種基于智能手機(jī)本地操作系統(tǒng)如iOS、Android、WP并使用原生程式編寫運(yùn)行的第三方應(yīng)用程序,也叫本地app。一般使用的開發(fā)語言為Java、C 、Objective-C。

自iOS和Android這兩個(gè)的手機(jī)操作系統(tǒng)發(fā)布以來，在互聯(lián)網(wǎng)界從此就多了一個(gè)新的名詞：App意為運(yùn)行在智能的移動(dòng)終端設(shè)備第三方應(yīng)用程序。

Native App因?yàn)槲挥谄脚_(tái)層上方，向下訪問和兼容的能力會(huì)比較好一些，可以支持在線或離線，消息推送或本地資源訪問，攝像撥號功能的調(diào)取。但是由于設(shè)備碎片化，App的開發(fā)成本要高很多，維持多個(gè)版本的更新升級比較麻煩，用戶的安裝門檻也比較高。但是比較樂觀的是，AppStore培養(yǎng)了一種比較好的用戶付費(fèi)模式，所以在Apple的生態(tài)圈里，開發(fā)者的盈利模式是一種明朗狀態(tài)，其他market也在往這條路上靠攏。

優(yōu)勢 1、相比于其它模式，提供最佳的用戶體驗(yàn)，最優(yōu)質(zhì)的用戶界面，最華麗的交互 2、針對不同平臺(tái)提供不同體驗(yàn) 3、可節(jié)省帶寬成本，打開速度更快 4、功能最為強(qiáng)大,特別是在與系統(tǒng)交互中,幾乎所有功能都能實(shí)現(xiàn)

WebApp

說到Web App 很多人會(huì)聯(lián)想到 WAP，或者有人認(rèn)為，WAP就是WebApp，其實(shí)并不是的。

WebApp 與 WAP 最直接的區(qū)別就是功能層面。WAP更側(cè)重使用網(wǎng)頁技術(shù)在移動(dòng)端做展示，包括文字、媒體文件等。而Web App更側(cè)重“功能”，是使用網(wǎng)頁技術(shù)實(shí)現(xiàn)的App?？偟膩碚f，Web App就是運(yùn)行于網(wǎng)絡(luò)和標(biāo)準(zhǔn)瀏覽器上，基于網(wǎng)頁技術(shù)開發(fā)實(shí)現(xiàn)特定功能的應(yīng)用。

響應(yīng)式的大部分技術(shù)都是為實(shí)現(xiàn)WebApp能適配多類客戶端而設(shè)計(jì)的。

Web網(wǎng)站一般分兩種，MPA(Multi-page Application)和SPA(Single-page Application)。而WebApp一般泛指SPA形式開發(fā)出的網(wǎng)站。這樣更像是一個(gè)App。

優(yōu)勢 1、可以跨平臺(tái)，調(diào)試方便 2、無需安裝，不會(huì)占用手機(jī)內(nèi)存，而且更新速度最快 3、不存在多版本問題，維護(hù)成本低 4、臨時(shí)入口，可以隨意嵌入

Hybird App

混合開發(fā)，也就是半原生半Web的開發(fā)模式，由原生提供統(tǒng)一的API給JS調(diào)用，實(shí)際的主要邏輯有Html和JS來完成，最終是放在webview中顯示的，所以只需要寫一套代碼即可達(dá)到跨平臺(tái)效果，另外也可以直接在瀏覽器中調(diào)試，很方便。最重要的是只需要一個(gè)前端人員稍微學(xué)習(xí)下JS api的調(diào)用即可。

Hybird App 的較早實(shí)踐者是PhoneGap，隨后遍地開花，如Titanium、Salama、WeX5、Kerkee和國內(nèi)的AppCan，項(xiàng)目各有各的實(shí)現(xiàn)方式，大致的原理基本相同。有幸在AppCan上海總部參與過一段時(shí)間的學(xué)習(xí)研究，如下大致簡介：

AppCan是基于HTML5技術(shù)的Hybird跨平臺(tái)移動(dòng)應(yīng)用開發(fā)工具。開發(fā)者利用Html5 Css3 JavaScript技術(shù)，通過AppCan IDE集成開發(fā)系統(tǒng)、云端打包器等，快速開發(fā)出Android、iOS、WP平臺(tái)上的移動(dòng)應(yīng)用。

AppCan的平臺(tái)構(gòu)成

在實(shí)際的APP開發(fā)中，AppCan可以完成大部分的工作量，如圖示：

AppCan將App底層復(fù)雜的原生功能封裝在引擎、插件中，開發(fā)者僅需調(diào)用接口、打包編譯，就可以獲得原生功能；靈活的插件擴(kuò)展機(jī)制。

開發(fā)者可以像開發(fā)WebApp一樣開發(fā)app的視覺UI，以及絕大部分的交互，當(dāng)需要使用原生功能（如攝像頭，陀螺儀等功能）時(shí)，只需要調(diào)用官方的API就可以輕松實(shí)現(xiàn)Native的效果。至于JS和Native的通信，常用的有URL監(jiān)聽和絕大部分Hybrid廠商使用的JSBridge通信，兩者原理相近。

在Hybird概念盛行的時(shí)候，國內(nèi)外各大公司也參與了探索，國外代表有Facebook、google、亞馬遜，國內(nèi)的有騰訊、阿里巴巴、網(wǎng)易等，慢慢的他們發(fā)現(xiàn)Hybird嚴(yán)重受限于WebView的解析渲染效率，于是Facebook開始了他的類原生的研究探索。