譯者:前端小智
為了保證的可讀性,本文采用意譯而非直譯。
Flutter 與 React Native混淆了嗎?
本文是幫助你瞭解這兩個應用程式開發框架區別指南。我們們知道,幾年前開發和維護iOS和Android的應用程式曾經是一項艱鉅的任務(獨立的程式碼庫|獨立的開發團隊|開發成本也忒高)。
一堆狗屎。
移動行業渴望進行一場革命,以遏制移動應用程式開發過程中出現的問題。
因此,跨平臺開發的形式就此出現了。現在,維護程式碼和開發應用程式對於開發人員來說變得簡單且耗時也少了。
跨平臺應用程式開發什麼時候出現的?
不僅開發商,企業和初創公司也通過為跨平臺應用的方式來開發他們的業務。不出所料,他們喜歡它。
為了提高應用開發的效率,越來越多的跨平臺應用開發框架應運而生。
臉書在2015年又跳了回來,推出了React native。
毫無疑問,它得到很好的回應。如今,React native 是 Facebook、沃爾瑪(Walmart)、優步(UberEats)、Instagram 和特斯拉(Tesla)等應用程式的幕後支持者。
後來,谷歌也加入了進來,並推出了廣受好評的跨平臺框架 Flutter。並保證了所有應用程式都具有原生效能。
從那時起,新創公司和企業就面臨著如何選擇應用程式開發的兩難境地。這使得 Flutter 與 React native 的爭論更加激烈。
在本文中,我們將討論React Native 和 Google 的 Flutter 之間備受爭議的論點。
想閱讀更多優質文章請[猛戳GitHub部落格][1],一年百來篇優質文章等著你!
什麼是 Flutter
Flutter 是谷歌的移動UI框架,可以快速在 iOS 和 Android上構建高質量的原生使用者介面。
什麼是 React Native
React Native (簡稱RN)是Facebook於2015年4月開源的跨平臺移動應用開發框架,是Facebook早先開源的JS框架 React 在原生移動應用平臺的衍生產物,目前支援iOS和安卓兩大平臺。RN使用Javascript語言,類似於HTML的JSX,以及CSS來開發移動應用,因此熟悉Web前端開發的技術人員只需很少的學習就可以進入移動應用開發領域。
現在你已經有了基本的認識,讓我們們來看看在 2019 年的 React Native 和 Flutter 中哪個更好?
Flutter vs React Native:詳細比較
讓我們詳細看看這兩個平臺之間的差異,並找出使用 React native 和Flutter 的優缺點。
程式設計語言
跨平臺的應用程式開發框架都使用不同的程式語言。
React native 可以使用 Javascript開發,這不需要任何介紹。長期以來,它一直是開發人員最好的程式語言。
因此,可以理解為什麼 React Native 在開發特定於伺服器,Web或移動應用程式時獲得了極大的歡迎。
然而,由谷歌開發的Flutter 使用了一種新的程式語言 Dart。對於開發人員來說,這是一個新技術,但是那些具有c++和JAVA等OOP語言經驗的開發人員可以輕鬆地學習編寫程式碼。
Dart 基於 C/C++、Java、支援抽象、封裝、繼承和多型等特性。Flutter 團隊之所以選擇 Dart,是因為它與構建使用者介面的方式相匹配,使用 Dart 橋接,應用程式的大小更大,但效果要快得多。與使用 JS 做橋接的 React Native 不同。
開發速度
企業,特別是初創企業尋找一個能夠在更短的時間內為他們提供服務應用的平臺。
談論Flutter 與 React Native 開發速度; React Native 獲得了優勢。 其即用型元件可幫助開發人員快速製作應用程式。 另一方面,Flutter 是一個尋求在開發時間方面擊敗競爭對手的新平臺。
[根據資料分析][2],React native 在美國的市場份額為4.3%。
效能
React Native
React Native / NativeScript, 你需要一個橋樑來呼叫 Swift 或 Android 或 Windows & Mac APIs。 Flutter使用的是 Dart, 所以你不需要那樣,一切都是原生的。 這也解決了 JS 生態系統之間的許多不同版本之間的問題,比如CommonJS, AMD。React Native 開發人員, 在開發混合應用時面臨問題, 但對於原生應用, 不會面臨任何與效能相關的問題。它在所有標準情況下都提供無縫效能, 並且高度可靠。
Flutter
根據他們的應用效能, 將 Facebook 的 React Native 與 Google 的 Flutter 進行比較, 是 Flutter 戰勝了競爭對手。Flutter 具有 Dart 的優勢, 並且沒有 JavaScript 橋接用於處理與裝置本機原生元件的互動, 開發速度和執行時間會大大加快。
Flutter 已將動畫標準設定為 60fps, 這清楚地表明瞭其高效能。最後, 由於 Flutter 被編譯成 Android 和 iOS 的原生 ARM 程式碼, 效能是它永遠不會面臨的一個問題。
總之,兩種平臺的效能都比較接近。
架構
在 React native 中,構建移動應用程式有兩種架構型別,Flux 和 Redux。
Flux
由Facebook 製作,而 Redux
受社群青睞。 由於單向資料流,App 是無狀態, 因為應用程式的狀態被 store
管理著。
作為一個新手,Flutter
很難為移動應用程式指定最佳架構。但是,也有一些受歡迎的元件,比如BloC(業務邏輯元件)。它們主要依賴於streams
和 RXDart
(Reactive Dart)。
####IDE 和易於編碼
如果我們談 React native 的 IDE,幾乎主流的IDE 都支援。然而,目前,Flutter 的 IDE 只有 Android studio/IntelliJ 和 visual studio 支援。
由於 React Native 使用 JS 語言開發,對於新手來說,學習曲線很容易。另一方面,Dart 作為新發明的語言對開發人員來說有些困難。但是,那些有 c++ 和 Java 經驗的人可以輕鬆地學習它。
程式碼結構
Google 的 Dart 沒有模板,樣式和資料檔案的分離。 因此,程式碼變得有點難以理解。 而Javascript遵循簡單的程式碼結構。 因此,開發人員更清楚地理解和編寫程式碼。
穩定性和靈活性
完美移動應用程式最重要的一個方面是穩定性。這兩個平臺都得到了領先技術社群的支援,因此對穩定性毫無疑問,兩者都有很好的穩定性。
React native 擁有大量的社群支援,因此,它成為最受歡迎和最可靠的框架之一。
另一方面,Flutter 推出了新版本的beta 2
,它也為開發人員提供了一些令人印象深刻的特性。
在提供靈活性和定製方面,React native顯然處於領先地位。通過直接與原生平臺互動,提供了無縫的使用者體驗。
然而,Flutter提供了一組豐富定製的 widgets 來建立一種引人入勝的體驗。雖然它正處於測試階段,試圖在市場上站穩腳跟。
人氣
說到人氣方面,正如我們提到的,React native 在混合應用程式開發中已經變得非常突出。它是任何 iOS 或 Android 專案開發人員的最愛。
無論它是一個小專案還是一個大專案,大量的元件都使它受到了應有的歡迎。
相反,正如我們所知,Flutter
正處於起步階段,並試圖在移動應用程式開發上留下自己的印記。我們不能忽視的事實,在推出的當天,Flutter 在 Twitter
上的趨勢如上圖。
世界電子商務巨頭阿里巴巴正在使用 Flutter,這表明了 Flutter 在混合應用開發方面的廣闊前景。
React Native 和 Flutter:快速對比
RN 和 Flutter 差異表:
工程技術 | React Native | Flutter |
首次釋出 | 2015年1月 | 2017年5月 |
公司 | ||
編碼語言 | JavaScript | Dart |
Github Stars(2019年) | 77,827 | 66,183 |
學習難度 | React或Javascript經驗豐富的開發人員易於學習 | 對於新手相對較難,但對於經驗豐富的C++和JAVA專家來說,這很容易學習 |
主要架構 | Flux & Redux | bLoC |
元件 | 有些是自動適應的 | 非適應性,需要手動配置 |
生態 | 成熟 | 還未成熟 |
熱更新 | 支援 | 支援 |
UI 元件 | 作業系統的原生元件 | Flutter |
文件 | 相對完整 | 相對混亂 |
原生效能 | 好 | 很好 |
主要使用者 | Facebook, Instagram, Pinterest,特斯拉,優步,沃爾瑪,Wix.com | 阿里巴巴,Google Greentea,谷歌搜尋引擎,App tree,騰訊 |
React native和 Flutter 之間的相似之處
我們已經看到了這兩個平臺之間的差異。但在某些領域,它們也有相似之處。
-
兩者都擁有受歡迎的技術社群的力量
-
它們用於跨平臺開發
-
兩者都允許同時執行新程式碼並保持應用程式狀態
-
開源、免費、快速
-
擁有頂級UI支援和原生體驗
總結
React Native 和 Flutter 都有自己的利弊. Flutter 在應用開發行業市場上仍然是新的, React Native 在之前就已經開始了, 以獲得良好的受眾優勢。
交流(歡迎加入群,群工作日都會發紅包,互動討論技術)
乾貨系列文章彙總如下,覺得不錯點個Star,歡迎 加群 互相學習。
我是小智,公眾號「大遷世界」作者,對前端技術保持學習愛好者。我會經常分享自己所學所看的乾貨,在進階的路上,共勉!
關注公眾號,後臺回覆福利,即可看到福利,你懂的。
每次整理文章,一般都到2點才睡覺,一週4次左右,挺苦的,還望支援,給點鼓勵
[1]: github.com/qq449245884… [2]: www.datanyze.com/market-shar… [3]: /img/bVbtNqb