FLUI 釋出了 0.9 版本，新增了動態渲染模組 Dynamic，新增懸浮列表頭元件，另外針對文件完善了 API 列表並且修復了若干問題。
Dynamic
Dynamic 模組允許我們載入下發或者快取的 JSON 來完成渲染。
DSL 設計上語義接近 Flutter 原始元件，僅僅是針對每個元件擴充了類似 uniqueId, unitName 這種標識性的屬性。所以在設定元件名時一般使用 Flutter 對應的 Widget 名稱，具體對映關係可參照文件
實現上 Dynamic 會將傳入的 JSON 字串反序列化成內建物件模型，然後生成 Widget 樹，最後將該樹根節點傳遞給容器元件。
由於 Google 在 Flutter 上禁用 dart:mirrors 導致動態性較弱，所以 Dynamic 是基於 Flutter 元件基礎上做了封裝，對一些互動性較強的場景暫時不能支援，推薦在一些靜態顯示區域做動態化下發和快取的嘗試。
Dynamic 會對傳入的字串進行 JSON 解析，但你也可以自行把其他格式比如 XML 或者 Protobuf 解析成指定模型物件，然後傳遞給容器檢視，依舊可以完成 UI 的渲染。
當你下發資料時，可以給指定的容器設定佔位的 loading 元件如下圖所示:
Dynamic 功能
目前 Dynamic 支援常用的渲染元件，對於互動邏輯較多的元件比如 TextField 暫不支援。
佈局方面，支援 Flex 以及 Stack-Positioned，另外也有 ListView 可供使用：
圖文方面，支援基礎的文字/富文字，asset 圖片和網路圖片。
對於基礎的互動事件 Dynamic 也有封裝，具體的定義和使用可以參照文件。
Dynamic 效能
耗時
這裡選用簡介上方的示例圖 Extend GitHub Demo ，該 json 字串長度為 5068 ，最深巢狀層級為 9 ，下面為不同裝置上的時間消耗：
| 階段 \ 裝置 | iPhone 7 Plus | iPhone X | OnePlus 7 Pro |
|---|---|---|---|
| JSON 解析 | 1 ~ 8 ms | 1 ~ 10 ms | 2 ~ 16 ms |
| 生成 Content Widget | 0 ~ 2 ms | 0 ~ 1 ms | 0 ~ 3 ms |
| 元件初始化到首幀總耗時 | 54 ~ 106 ms | 41 ~ 75 ms | 85 ~ 160 ms |
可以看到 Dynamic 引入的相關耗時較低，主要時間消耗依舊在渲染檢視階段。
幀率
幀率方面 ( 來自 OnePlus 7 Pro 的資料 ) , 渲染元件樹加 push 動畫過程中，最長一幀繪製時間為 30 ~ 40 ms，而大部分時間集中在 6 ~ 10 ms / frame，以某一次時間幀率波動為例：
而渲染一個相同原生元件樹的幀率波動與 Dynamic 是相似的，並無明顯差異。
記憶體
同樣是 Extend GitHub Demo，某一時刻記憶體快照排名前十的物件如下：
Dynamic 模型前五如下:
相對而言，元件樹上的物件在記憶體中佔比相對較高但同樣也需要注意動態渲染模型的數量不要過多。
其他更新
API Table
對元件文件頁面新增了 API 列表，方便了解每個元件的屬性和如何使用。
列表頭部元件
FLSliverPersistentHeaderWidgetBuilder 可以幫助構建列表區域，並且使其中頭部元件附帶吸頂效果。
另外新版本還補充了一些屬性並且針對之前的問題進行了修復。
歡迎關注掘金主頁，需要訂閱的話也可以關注公眾號：