Google 為什麼以 Flutter 作為原生突破口

DevYK發表於2019-03-21

flutter.png

Android 的前生今世

Android 系統

Android 系統作為全球第一大系統,基於 Java 開發的移動端有著諸多的效能優勢。 2018年前 H5 的效能瓶頸和 react-native 的一系列缺點(動畫效能、第三方依賴、邏輯上的額外開銷、除錯的困難、不能完全遮蔽原生平臺 等)導致業界對跨平臺開發失去信心。 直到 2018 年 10 月 Google 推出首個 Flutter 跨平臺解決方案,打破整個移動開發的方向。

為什麼 Flutter 成為 Android 方向標

  1. 跨平臺性: Flutter 基於影象繪製引擎進行渲染,在不同平臺下繪製效果是絕對一致的,能做到真正的跨平臺,一處寫處處執行
  2. 效能優異性: 不同於 H5 通過 DOM 渲染 和 RN 對映元件,Flutter 直接基於 native 進行繪製。效能上完全超過原生
  3. 熱過載性: Android 原生開發 會遇到 編譯-打包-安裝 三部曲。開發效率遲遲得不到提升。熱過載技術在 Flutter 內完美體現

Flutter 詳細介紹

  1. Dart 語法編譯: Dart 是一種強型別、跨平臺的客戶端開發語言。具有專門為客戶端優化、高生產力、快速高效、可移植易學的風格。Dart 主要由 Google 負責開發和維護
  2. Flutter 外掛: Flutter 使用的 Dart 語言無法直接呼叫 Android 系統提供的 Java 介面,這時就需要使用外掛來實現中轉。Flutter 官方提供了豐富的原生介面封裝

Flutter 系統結構

1552893059(1).jpg

Skia 影象處理引擎

  1. 2005 年 Skia 影象處理引擎成立,用來展示 Chrome 火狐 和其他 Google 自家的產品使用。
  2. 2007 年 第一個 Android 系統問世,於是 Google 開發者將 Skia 移植到 Android 平臺。
  3. Skia 作為一個 2D 的圖形系統,包括繪圖,渲染,顯示圖片都是用 Skia 完成。

原生開發會接觸 SKia 嗎?

1552893230(1).jpg

Skia 引擎詳解

  • 疑問: 是真的嗎?我只接觸過 Bitmap,原來 Bitmap 下面還有很多奧祕

    1552893376(1).jpg

    1552893413(1).jpg

    1552893442(1).jpg

Skia 引擎與 Flutter 有什麼關係勒?

  • 除了通過 xml 方式定義佈局 或者繼承View 顯示在 Android 螢幕外還有沒有方法呢?

1552893533(1).jpg

為什麼 Flutter 會實現三大特性

1552893626(1).jpg

跨平臺

1552893676(1).jpg

效能優異

1552893718(1).jpg

渲染流程

1552893764(1).jpg

React 渲染與 Flutter 渲染相同點

1552893882(1).jpg

React 渲染與 Flutter 渲染不同點

  1. 繪製樹:ReactNative 基於 ReactShadow 的鏈式結構在記憶體中形成一個虛擬的 Dom 樹,Flutter 是通過引擎實現不同圖層的渲染方式。
  2. 機制不一樣:ReactNative 最終被反射成原生控制元件,而 Flutter 是底層通過引擎直接渲染,不存在對映的說法。

Flutter 渲染

在 Flutter 介面渲染過程分為三個階段:佈局、繪製、合成,佈局和繪製在 Flutter 框架中完成合成則交由引擎負責。

1552894074(1).jpg

Flutter優勢

  • Flutter 橫空出世! 在 Flutter 的響應式框架中,控制元件樹中的控制元件直接通過可移植的圖形加速渲染引擎、⾼效能的本地 ARM 程式碼進⾏繪製,不再需要通過虛擬 DOM 或虛擬控制元件、真實 DOM 或平臺控制元件這些中間物件來繪製。Flutter 響應式框架通過“⽆中間商賺差價”的⽅式直接利⽤硬體的所有效能,所以正如前⾯所說的,Flutter 應⽤的效能⽐原⽣ App 更加優秀。

個人見解

  • 相對於幾大跨平臺框架,個人還是很看好 Flutter 的。畢竟是 Google 的親兒子嘛,還是可以先入坑的,自己動手寫一個 Flutter APP 出來。在不同裝置上跑一下,自己體驗一下。

計劃

後續我會推出從零開發一個完整的 Flutter 專案一系列文章, 把自己踩得坑記錄下來。

Flutter 系列文章

感謝

相關文章