它來了！Flutter 應用內調試工具 UME 開源啦

做者：字節跳動終端技術 —— 趙瑞

先說重點

• Pub 地址：pub.dev/packages/fl…
• GitHub 地址：github.com/bytedance/f…

背景

字節跳動已有累計超過 70 款 App 使用了 Flutter 技術，公司內有超過 600 位 Flutter 開發者。在這一數字背後，有一條完整的 Flutter 基礎設施鏈路做爲支撐。

UME 是由字節跳動 Flutter Infra 團隊出品的 Flutter 應用內調試工具，目的是在脫離 Flutter IDE 與 DevTools 的狀況下，提供應用內的調試功能。

在字節跳動，UME 內部版已打磨了近一年時間，服務了近二十個 App，衆多插件功能廣受開發者好評。本次發佈的開源版 UME 提供了 10 個不一樣功能的調試插件，覆蓋 UI 檢查、性能工具、代碼查看、日誌查看等衆多功能。不管是設計師、產品經理、研發工程師或質量工程師，都能直接從應用內獲取有用信息，從而提高整個團隊的研發、調試與驗收效率。

功能介紹

UI 插件包

UI 檢查插件包，提供了經過點選 widget 獲取 Widget 基本信息、代碼所在目錄、Widget 層級結構、RenderObject 的 build 鏈與描述的能力，顏色吸管與對齊標尺在視覺驗收環節提供有力幫助。

代碼查看

代碼查看插件，默認基於 WidgetInspectorService 提取 creationLocation, 拿到當前頁面的 library，再經過 VM Service 獲取對應代碼內容。

容許用戶輸入關鍵字，經過遍歷 scriptList 對 library 進行模糊匹配，實現對任意代碼內容的查看能力。

日誌展現

經過重定向 foundation 包中的 debugPrint，實現對日誌輸出函數的插樁處理，並記錄日誌輸出時間等額外信息，經過統一面板提供篩選、導出等功能。

性能插件包

性能插件包將 Flutter 官方提供的性能浮層引入，實現脫離 DevTools 查看性能浮層的能力；內存信息方面提供了當前 VM 對象實例數量與內存佔用大小等信息。

設備信息插件包

設備信息插件展現了 device_info Plugin 提供的信息；CPU 信息插件基於 system_info Plugin，直接從 Dart 層讀取系統基礎信息。

開發自定義插件

除了上述的 UME 內置插件外，開發者能夠基於 UME 提供的統一插件管理與基礎服務，開發適合本身業務的插件包。

實現方式也很是簡單，只須要實現 Pluggable 虛類中的方法，提供插件必要信息便可，代碼示例以下圖。

開發者能夠參考開源倉庫中的 custom_plugin_example 示例，以及 kits 目錄下的全部插件包代碼，來了解如何實現一個自定義插件包。

訪問基礎服務

爲簡化插件開發，提升代碼複用性，UME 封裝了 Inspector、VM Service 等做爲基礎服務，插件可方便地拓展能力。

除此以外，UME 還提供了 FloatingWidget 通用浮窗容器、StoreMixin 存儲能力等，供插件使用。

歡迎參與開源貢獻與共建

因爲不少功能依賴引擎及工具鏈的改動，所以開源版的 UME 相比於公司內部版本在功能上進行了不少精簡。但開發團隊也在不斷尋求解決方案，避免修改引擎，或將改動合入官方倉庫，將更多實用功能引入開源版 UME。

咱們鼓勵廣大開發者，參與到 UME 的開發與生態建設上。好比開發更多實用的插件並貢獻給社區，在 GitHub Issues 上提交功能建議、問題反饋，或修復問題並提交 Pull Request。

歡迎各位開發者加入字節跳動 Flutter 技術交流羣參與技術交流與討論。

關於字節終端技術團隊

字節跳動終端技術團隊(Client Infrastructure)是大前端基礎技術的全球化研發團隊（分別在北京、上海、杭州、深圳、廣州、新加坡和美國山景城設有研發團隊），負責整個字節跳動的大前端基礎設施建設，提高公司全產品線的性能、穩定性和工程效率；支持的產品包括但不限於抖音、今日頭條、西瓜視頻、飛書、瓜瓜龍等，在移動端、Web、Desktop等各終端都有深刻研究。

就是如今！客戶端／前端／服務端／端智能算法／測試開發 面向全球範圍招聘！一塊兒來用技術改變世界，感興趣能夠聯繫郵箱 chenxuwei.cxw@bytedance.com，郵件主題 簡歷-姓名-求職意向-指望城市-電話。