5G到來，App的將來，是JavaScript，Flutter仍是Native ？

Native App

React Native（RN）發佈於2015年，也是使用JavaScript語言進行跨平臺APP的開發。與H5開發不一樣的是，它使用JS橋接技術在運行時編譯成各個平臺的Native代碼，其使用的技術Facebook的Flux技術。

其特色是：

• 使用JavaScript語言，因爲JS被普遍地使用，因此RN也很容易被接受。

• RN依賴JS的運行時環境，也就是JS橋接技術。其使用Facebook的Flux架構。

• RN僅提供了UI渲染和設備訪問的API，不少功能必須依賴第三方庫來實現對本地組件的使用。

• 生態目前比較完善，使用的公司也比較多，特別是對JS比較熟悉的同窗容易上手。

• 支持熱部署，開發過程當中能夠節約不少時間。

可是它也並非完美的：

• 它的渲染方式仍是調用各個平臺的原生控件，有時須要針對不一樣的平臺作不一樣的優化。

• 其性能相對於H5有很大的提升，可是並無完美解決，白屏，丟幀問題依然存在。

傳統的原生APP開發模式，有IOS和AOS兩大系統，須要各自語言開發各自APP。

目前也有不少跨平臺應用使用React Native。它也是跟Flutter對比的主要對象。

優勢：其優勢是目前的生態相對比較成熟

缺點：開發和發佈成本高

• 舉個栗子：網易管家APP （Tab1，Tab2）
• 應用技術：Swift，OC，JAVA

WebApp

常被人提起的H5技術，其實就是網頁+JavaScript。好比目前的一些流行的JS框架Vue，React，AngularJS等都是爲了構建網頁。針對移動端構建出來的網頁能夠實如今跨平臺的功能，可是其缺點也很明顯：

• 渲染效率低下，用戶體驗差。不少H5在iOS平臺表現尚可，可是在Android上特別是一些低端機上的表現確實讓人不敢恭維。

• 網頁調用設備硬件相關API比較困難，並且支持的功能較少，實現此類需求是H5的短板。

• 移動端的網站，常被稱爲H5應用，說白了就是特定運行在移動端瀏覽器上的網站應用。通常泛指 SPA(Single Page

• Application)模式開發出的網站，與MPA（Multi-page Application，再後面作介紹）對應。

優勢 ：開發和發佈成本最低

缺點 ：性能和體驗不能講是最差的，但也受到瀏覽器處理能力的限制，屢次下載一樣會佔用用戶必定的流量

• 舉個栗子：網易管家APP（Tab3）
• 應用技術：ReactJS，RegularJS等

Hybrid App

• 混合模式移動應用，介於web-app、native-app這二者之間的app，兼具「Native App良好交互體驗的優點」和「Web App跨平臺
• 開發的優點」（百度百科解釋）
• 主要的原理是，由Native經過JSBridge等方法提供統一的API，而後用HTML+CSS實現界面，JS來寫邏輯，調用API，最終的頁

** 面在webview中顯示，這種模式下，Android、iOS的API通常有一致性，Hybrid App全部有跨平臺效果。**

優勢： 開發和發佈都比較方便，效率介於Native App、Web App之間

缺點： 學習範圍較廣，須要原生配合

• 舉個栗子：網易雲音樂，我愛我家App

** 應用技術：** PhoneGap，AppCan，Wex5

React Native App

Facebook發現Hybrid App存在不少缺陷和不足，因而發起開源的一套新的APP開發方案RN App。。使用JSX語言寫原生界面，

js經過JSBridge調用原生API渲染UI交互通訊。

優勢： 效率體驗接近Native App，發佈和開發成本低於Native App

缺點： 學習有必定成本，且文檔較少，免不了踩坑

舉個栗子：Facebook、youtube、discord、QQ、百度等等

WEEX App

• 阿里巴巴開發團隊在RN的成功案例上，從新設計出的一套開發模式，站在了巨人肩膀上並有淘寶團隊項目作養料，廣受關注，

2016年4月正式開源，並在v2.0版本官方支持Vue.js，與RN平起平坐。

優勢： 開發效率和體驗上跟RN不相上下，而且跨平臺性更強

缺點： 剛剛起步，社區沒有RN活躍

• 舉個栗子：淘寶、天貓、餓了麼等

• Flutter 鹹魚正在使用 ， 並且他們也推薦你們嘗試新技術 來自谷歌，不過貌似國內崗位少，有人說寫這個35歲後能夠出國。（我等將信將疑）

Flutter介紹

Flutter是Google推出的開源移動應用開發框架。開發者能夠經過開發一套代碼同時運行在iOS和Android平臺。

它使用Dart語言進行開發，而且最終編譯成各個平臺的Native代碼，這樣既保證了開發效率，也保證了各個平臺的運行效率。其至關於從頭至尾重寫了一套UI框架，不依賴具體平臺的組件。其全部的組件都是"Widget"。渲染引擎則依靠高效渲染庫Skia實現。

Flutter也看到了目前的跨平臺解決方案並不完美，因此它借鑑了React Native的一些思想，作出了很大的優化。它將代碼編譯成原生代碼，而且直接在各個平臺中使用其高效渲染引擎Skia進行渲染，沒有橋接，不調用平臺相關控件。

這種設計思想完美解決了不一樣平臺的性能問題。

歸功於其設計思想，咱們能夠真正實現一套代碼，運行不一樣的平臺。在其推出以後，關注的開發者數量和相關的教程的增加速度遠超當時的React Native。

其特色包括：

• 使用Google自主開發的Dart語言。Dart語言是一個強類型的語言，很好地支持面向對象，而且易於學習和使用。
• 使用谷歌本身的Skia渲染引擎，Android自帶Skia引擎，iOS平臺上Flutter也會把Skia引擎打包到APP中，實現高效渲染。
• 目前有很是豐富的視圖組件，能夠點擊這裏查看其組件目錄，包括Android上經常使用的材料設計（Material Design）的UI風格，和iOS風格（Cupertino）。因爲其渲染不依賴各平臺相關組件，因此運行在不一樣平臺上的效果是一致的。
• 一樣支持熱部署，開發時能夠像網頁開發同樣實時看到效果。

目前它存在的一些問題是：

• 國內學習資源目前並不豐富，使用Flutter的公司也比較少。
• 相關的生態尚未React Native那樣豐富，可是其發展速度大大超過了React Native。

總結

運用於跨平臺開發的語言還有不少，如PWA，Uni App等。我的看來，Flutter最具備發展潛力的其中一個，雖然Flutter目前並非很是流行，可是筆者相信它是跨平臺解決方案的將來。若是谷歌的新系統Fuchsia OS能像當今的Android這樣如日中天，甚至替代掉Android的話，Flutter的發展也會迎來它的頂峯。

若是你想作一個企業名片之類的東西，讓更多人知道自家產品，那也許一個網站就夠了；但若是產品核心功能只有native app才能提供，或者你想要確保用戶有更好的體驗、更強的黏性，那可能就須要作native app。

閱讀更多

一波Flutter酷炫特效來襲

金三銀四，2019最新面試實戰總結

歷來不糾結算法，冒泡排序這樣優化？

動畫：一招學會TCP的三次握手和四次揮手

關於Gradle， 搞定Groovy閉包這一篇就夠了

最後若是對技術比較感興趣，歡迎關注個人微信公衆號：終端研發部，id：codeGooger，一塊兒進階技術