作者:字節跳動終端技術 —— 趙瑞
先説重點
- Pub 地址:https://pub.dev/packages/flut...
- GitHub 地址:https://github.com/bytedance/...
背景
字節跳動已有累計超過 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,郵件主題 簡歷-姓名-求職意向-期望城市-電話。
字節跳動應用開發套件MARS是字節跳動終端技術團隊過去九年在抖音、今日頭條、西瓜視頻、飛書、懂車帝等 App 的研發實踐成果,面向移動研發、前端開發、QA、 運維、產品經理、項目經理以及運營角色,提供一站式整體研發解決方案,助力企業研發模式升級,降低企業研發綜合成本。