UC 內核團隊再出發，打造全新 Flutter 渲染引擎 —— Hummer

招賢納士​

咱們急切須要瀏覽器渲染引擎/Flutter 渲染引擎的人才，歡迎大牛們_加入咱們_。

前言

Flutter 能夠說是近兩年來最火爆的移動跨平臺方案，不管是創新型應用仍是老牌旗艦型應用，都在或多或少地嘗試 Flutter 技術。基於如下三點優點，Flutter 正在逐漸煥發光彩：

1. 不一樣於 Weex、RN 等方案，Flutter 採用自繪渲染，實現跨端跨平臺運行高度一致性；
2. 簡化的渲染流水線設計及極致的 AOT，提供了媲美 Native 的性能；
3. Google 強大的技術支撐及迅速擴大的生態。

雖然 Flutter 看起來很是美好，可是它畢竟只是一個有潛力的新生兒。隨着業務的逐漸深度使用，業務同窗在 Flutter 上面遇到了一些難以解決的問題，這些問題須要從引擎層面進行優化和改造。因而，U4 內核團隊也開始投身到 Flutter 的洪流當中，但願能經過團隊的技術，給業務帶來更好的體驗。

爲了便於交流和區分，咱們的 Flutter 定製引擎以 Hummer 爲代號。Flutter 意爲抖動翅膀，Google 寓意流暢的性能，Hummer 即蜂鳥，世界上抖動翅膀最快的鳥，也是最小的鳥。咱們但願 U4 內核團隊定製的 Flutter 引擎，能夠像蜂鳥同樣小巧迅捷，同時又能夠幫助業務開發出如蜂鳥同樣漂亮的應用。

總覽

Hummer 引擎以業務驅動爲核心，結合 U4 內核團隊多年的 Web 引擎開發經驗，並積極擁抱社區，主要從性能優化、功能加強、配套工具、問題解決四個方面進行深度定製與優化。下文簡要介紹了咱們接近完成或已經完成的優化成果，這些成果咱們後面會陸續在公衆號上與讀者分享，敬請關注。

重要成果

基於 LLVM 的 AOT 編譯器

雖然 Dart AOT 產物作了極致的優化，使得它的運行性能能夠媲美 Java、C++ 等老牌語言，可是整個編譯流水線仍然有優化空間。咱們經過對 Dart 編譯器進行改造，利用 LLVM 編譯器生成代碼尺寸小性能高的特色，能夠有效地減小引擎產物尺寸，而且提升代碼運行性能。

咱們的目標是：

• AOT 生成代碼性能提高 30%
• AOT 代碼生成尺寸減小 30%

目前 arm3二、arm64 已經經過全部測試，正在進入最後的優化階段，很快就能夠接入使用。

目前官方也在關注咱們編譯器的優化工做，但願達到效果後能貢獻給社區。

混合棧開發方案優化

雖然 Flutter 官方支持與 Native 應用混合開發，可是到目前爲止，Flutter 對混合開發的支持仍然不夠友好，它存在的一些問題，一直是開發者心中的劇痛。混合開發主要體如今三個場景：

1. 全屏 Flutter 界面中，部分區域嵌入 Native 控件；
2. 全屏 Flutter 界面與全屏 Native 界面的互相導航切換；
3. 全屏 Native 界面中，部分區域嵌入 Flutter 控件。

針對第一個場景，咱們經過挖洞混合渲染方式，解決原生混合渲染方案性能、兼容性差的問題。測試場景下，FlutterView 幀率最高有 28% 的優化、嵌入的 PlatformView 幀率最高有 50% 的優化。

如下視頻中，左側是優化前的效果，右側是優化後的效果。

掘金沒法插入視頻，請點擊[連接](https://www.bilibili.com/video/BV13A411J7uH/)查看。

針對第二個場景，現有的主流方案經團隊評估後發現存在着後續升級難的問題。後續 Hummer 除了參考現有方案提供類似的能力外，還會着重考慮如何下降 Hummer 的升級成本，確保 Hummer 有能力緊隨官方的最新版本。針對第三個場景，咱們將會結合官方的 Multiple Flutters 方案，開始着手於引擎層面的改造，但願能夠實現下面目標：

1. FlutterView 能夠靈活地在各類不一樣場景下使用，全屏、內嵌做爲 Tab、Card、Cell 等等；
2. 建立 2+ FlutterView 對系統資源和內存佔用的額外佔用較小，初始化開銷更小，應用能夠更放心地同時使用多個 FlutterView；
3. 在複雜業務場景下提供有效的內存峯值控制機制，減小業務對內存佔用的擔憂，而且不須要業務的 Flutter App 修改代碼；
4. 在 Framework 和容器層提供一套 API ，實現數據共享（Flutter App 之間，Flutter 和 Native 之間）。

啓動及首幀性能優化

咱們對 Hummer 引擎的啓動和首幀作了針對性的優化。優化後的引擎給實際業務帶來了巨大的性能改善。業務實際統計獲得的結果爲，啓動耗時減小80%，首幀耗時減小60%。

自適應的 DarkMode 方案

對標 Chromium 的自適應 DarkMode 方案，實現界面一鍵切換 DarkMode，不須要從新設計主題，極大提高業務方的研發效率。

下圖是咱們使用開源 flutter_deer 工程，增長 DarkMode 擴展語法後運行在 Hummer 上的效果。感興趣的讀者也能夠自行查看該工程本身實現的 DarkMode 的效果。

網絡庫加強方案

Hummer 引擎能夠不依賴原生的網絡庫，經過外接網絡庫來加強網絡能力，實現網絡請求速度翻倍。

相關 PR

儘管參與 Flutter 引擎優化時間不長，但 U4 內核團隊已經屢次向主線提交 PR，大部分 PR 目前已經合入。咱們但願經過這種方式，提高阿里巴巴在 Flutter 社區的影響力，也促進整個 Flutter 生態的發展，讓 Flutter 爲業務方帶來更大的價值。

將來

U4 內核團隊，專一渲染引擎 & 虛擬機技術十數年。做爲阿里巴巴集團經濟體共建 Flutter 的重要參與方，積極擁抱社區，力求給業務帶來最大化的價值提高。Hummer 是咱們深度定製優化的 Flutter 引擎，融合了團隊在 Web 引擎上的多年技術沉澱。歡迎從事相關技術研究或基於 Flutter 構建應用的同窗提出寶貴的意見或建議。

U4 內核致力於打造性能最好、最安全的 web 平臺，讓 web 無所不能。

關注公衆號請搜索 U4內核技術，即時獲取最新的技術動態