Android 的前生今世
Android 系統
Android 系統作為全球第一大系統,基於 Java 開發的移動端有著諸多的效能優勢。 2018年前 H5 的效能瓶頸和 react-native 的一系列缺點(動畫效能、第三方依賴、邏輯上的額外開銷、除錯的困難、不能完全遮蔽原生平臺 等)導致業界對跨平臺開發失去信心。 直到 2018 年 10 月 Google 推出首個 Flutter 跨平臺解決方案,打破整個移動開發的方向。
為什麼 Flutter 成為 Android 方向標
- 跨平臺性: Flutter 基於影象繪製引擎進行渲染,在不同平臺下繪製效果是絕對一致的,能做到真正的跨平臺,一處寫處處執行
- 效能優異性: 不同於 H5 通過 DOM 渲染 和 RN 對映元件,Flutter 直接基於 native 進行繪製。效能上完全超過原生
- 熱過載性: Android 原生開發 會遇到 編譯-打包-安裝 三部曲。開發效率遲遲得不到提升。熱過載技術在 Flutter 內完美體現
Flutter 詳細介紹
- Dart 語法編譯: Dart 是一種強型別、跨平臺的客戶端開發語言。具有專門為客戶端優化、高生產力、快速高效、可移植易學的風格。Dart 主要由 Google 負責開發和維護
- Flutter 外掛: Flutter 使用的 Dart 語言無法直接呼叫 Android 系統提供的 Java 介面,這時就需要使用外掛來實現中轉。Flutter 官方提供了豐富的原生介面封裝
Flutter 系統結構
Skia 影象處理引擎
- 2005 年 Skia 影象處理引擎成立,用來展示 Chrome 火狐 和其他 Google 自家的產品使用。
- 2007 年 第一個 Android 系統問世,於是 Google 開發者將 Skia 移植到 Android 平臺。
- Skia 作為一個 2D 的圖形系統,包括繪圖,渲染,顯示圖片都是用 Skia 完成。
原生開發會接觸 SKia 嗎?
Skia 引擎詳解
-
疑問: 是真的嗎?我只接觸過 Bitmap,原來 Bitmap 下面還有很多奧祕
Skia 引擎與 Flutter 有什麼關係勒?
- 除了通過 xml 方式定義佈局 或者繼承View 顯示在 Android 螢幕外還有沒有方法呢?
為什麼 Flutter 會實現三大特性
跨平臺
效能優異
渲染流程
React 渲染與 Flutter 渲染相同點
React 渲染與 Flutter 渲染不同點
- 繪製樹:ReactNative 基於 ReactShadow 的鏈式結構在記憶體中形成一個虛擬的 Dom 樹,Flutter 是通過引擎實現不同圖層的渲染方式。
- 機制不一樣:ReactNative 最終被反射成原生控制元件,而 Flutter 是底層通過引擎直接渲染,不存在對映的說法。
Flutter 渲染
在 Flutter 介面渲染過程分為三個階段:佈局、繪製、合成,佈局和繪製在 Flutter 框架中完成合成則交由引擎負責。
Flutter優勢
- Flutter 橫空出世! 在 Flutter 的響應式框架中,控制元件樹中的控制元件直接通過可移植的圖形加速渲染引擎、⾼效能的本地 ARM 程式碼進⾏繪製,不再需要通過虛擬 DOM 或虛擬控制元件、真實 DOM 或平臺控制元件這些中間物件來繪製。Flutter 響應式框架通過“⽆中間商賺差價”的⽅式直接利⽤硬體的所有效能,所以正如前⾯所說的,Flutter 應⽤的效能⽐原⽣ App 更加優秀。
個人見解
- 相對於幾大跨平臺框架,個人還是很看好 Flutter 的。畢竟是 Google 的親兒子嘛,還是可以先入坑的,自己動手寫一個 Flutter APP 出來。在不同裝置上跑一下,自己體驗一下。
計劃
後續我會推出從零開發一個完整的 Flutter 專案一系列文章, 把自己踩得坑記錄下來。
Flutter 系列文章
- Flutter (一) Dart 語言基礎詳解(變數、內建型別、函式、操作符、流程控制語句)
- Flutter (二) Dart 語言基礎詳解(異常,類,Mixin, 泛型,庫)
- Flutter (三) Dart 語言基礎詳解 (非同步,生成器,隔離,後設資料,註釋)