眾所周知,Flutter 是一個非常優秀的開發框架,開發者可以借助它在 IOS 以及 Android 構建交互豐富的、精美的應用程序。在2022年谷歌開發大會上,作為I/O主題演講的一部分,主創團隊正式推出 Flutter 3.0。
Flutter 3.0 更新概況
Flutter 3.0 完成了從以移動為中心到多平臺框架的路線圖,提供了對macOS和linux桌面應用的支持,以及對Firebase集成的改進,新的生產力和性能特性,并支持Apple Silicon。
具體來看,Flutter 3.0 增加了對macOS和Linux應用的穩定支持。增加平臺支持需要的不僅僅是渲染像素:它包括新的輸入和交互模型、編譯和構建支持、可訪問性和國際化,以及特定平臺的整合。目標是讓大家能夠靈活地充分利用底層操作系統,同時盡可能多地分享開發者選擇的用戶界面和邏輯。
在macOS上,已經支持英特爾和蘋果Silicon,并提供通用二進制支持,使應用程序能夠打包可執行文件,在兩種架構上原生運行。在Linux上,Canonical和谷歌已經合作為開發提供了一個高度集成的、最好的選擇。
Flutter 3還對許多基本要素進行了改進,提高了性能,支持Material You,并更新了生產力。
Flutter 應用情況
隨著 Flutter 開發框架的不斷成熟,越來越多的人開始用它構建應用程序。截止目前,有超過50萬個應用程序是用Flutter建立的。來自data.ai等研究公司的分析,以及公眾的評價,表明Flutter被許多細分領域的客戶所使用:從微信等社交應用到Betterment和Nubank等金融和銀行應用;從SHEIN和trip.com等商務應用到Fastic和Tabcorp等生活方式應用;從My BMW等伴侶應用到巴西政府等公共機構。
同時在 Flutter 3.0 發布會上,研發團隊發布了基于開發者的調研數據:
- 91% 的開發者認為 Flutter 縮短了構建和發布應用程序的時間。
- 85%的開發者認為Flutter使他們的應用程序比以前更漂亮。
- 85%的人認為Flutter使他們的應用比以前能在更多的平臺上發布。
Flutter 助力小程序開發
小程序作為我國技術研發屆的一個獨特產物,由于其輕量、便捷、優質的體驗在近些年得到迅速的發展,特別是在騰訊、阿里、百度、字節等各家大廠的小程序開發平臺助推下,其中僅微信小程序的數量就超過700萬,小程序開發者數量300-400萬人,規模相當驚人。
小程序與 Flutter 最密切關聯還是在渲染優化上,先來看看整個框架:
在這個架構下,我們就將 Layout 層的 LV-CPP 專門的作為小程序的 UI 體系處理器,將 UI 信息布局計算好再提交給抽象的后端去渲染,LV-CPP 作為小程序的框架和渲染器的中間層,集中的在 C++ 層去處理與 Web 相關的復雜特性。渲染端就可以基于特定的協議和接口專注將元素轉化為 UI 組件,最終繪制出來。
通過結合 Flutter 和 LV-CPP,我們把實現代碼收斂在 C++ 和 Dart 上,進一步簡化了基于小程序技術棧實現跨平臺業務開發的框架維護成本。
再來看看各家廠商是如何開展的:
京東:把Flutter擴展到微信小程序端的探索
京東發起了Flutter_mp的開源項目,此框架主要做到兩件事情:
1.需要根據Flutter生成相關的小程序wxml模板文件。
2.收集wxml渲染需要的數據,放置到小程序組件的data字段。
flutter_mp還處于早期的實驗階段,很多功能還在探索規劃中,只支持Center,Column,Container,Expanded,Image.asset,ListView,Row,Text這些基本Widget,暫不支持 自定義Widget,而且自己的Flutter代碼只能夠出現在lib/main.dart文件中。
美團:基于跨平臺框架 Flutter 的動態化平臺建設
微信和咸魚都強調Flutter的跨平臺,而美團則強調了Flutter的動態化,而我們知道,Flutter不支持線上的動態化,所以美團的分享主要圍繞邏輯層動態化和渲染層動態化來進行。
美團在動態化引擎部分預置了一個JSC模塊,也就是JsCore,通過JSC來執行JAVAScript從而實現邏輯層的動態化,而渲染層動態化則通過xml+css來展示,然后解析生成布局樹并最終通過Flutter來渲染。
微信:基于小程序技術棧的微信客戶端跨平臺實踐
微信小程序,最開始是采用Webview渲染的方案,后面又采用了React-Native-Like的方案,再后來微信提出了一個很大膽的想法:上層依然使用WXML+WXSS來表示,但是底層使用Flutter引擎來渲染,而且他們覺得Platform Channel通信效率低,自己整了一個dart2cpp的模塊來負責通信。目前微信不會放棄 WebView 渲染,嘗試僅限于微信客戶端內部部分場景使用。
FinClip:基于小程序技術的跨端開發平臺建設
FinClip作為小程序容器技術,也可以說是小程序沙箱Runtime/Engine,提供Runtime基于瀏覽器內核,采用動態語言(JS)和聲明式View構建(XML),兼容互聯網主流小程序技術,可采用Vue、react基礎上的DSL框架。
實際上不與Flutter、Reactive-Native、100% Native或Framework們技術沖突,嵌入即可,個體小程序開發依然可享受React等Web Framework、mate Framework、DSL Frameworke 的成果
這種小程序容器技術,將視圖層與邏輯層分離也帶來了許多好處:
1、方便多個小程序頁面之間的數據共享和交互。在小程序的生命周期中具有相同的上下文可以為具備原生應用程序開發背景的開發人員提供熟悉的編碼體驗;
2、Service和View的分離和并行實現可以防止JS執行影響或減慢頁面渲染,這有助于提高渲染性能;
3、因為JS在Service層執行,所以JS里面操作的DOM將不會對View層產生影響,所以小程序不能操作DOM結構的,這也使得小程序的性能比傳統的H5更好。
FinClip 提供了Flutter SDK,支持在 Flutter 環境使用小程序;以滿足 Flutter 和小程序混編的效果。