wui_builder

一個用於網絡構建用戶界面的飛鏢庫，靈感來自ReactJS

用於在DART中建立基於組件的網絡用戶界面。

為SVG和標準HTML提供了豐富的類型虛擬元素庫。

支持定義具有類似於React的接口的自定義組件。支持所有相同的生命週期方法。

從一開始就牢記異步呈現。

完全符合飛鏢2，強模式和DDC。

文檔和示例

在GitHub頁面上查看文檔，以了解該框架

是什麼使這個虛擬的DOM框架不同？

它用飛鏢寫。加：

生成的虛擬DOM元素

發電機是WUI_Builder最獨特的功能。發電機為DART HTML和SVG軟件包中定義的每個元素類型生成虛擬DOM元素構建器。每個虛擬DOM元素構建器提供與相應的HTML/SVG元素相同的鍵入設置器。這使得編寫彈性組成部分變得容易。

可配置的更新計劃

接下來，WUI_Builder支持迭代渲染，以避免在大型更新中阻止主線程。迭代更新僅在空閒回調上的進程，這意味著渲染作業和佈局將在多個幀中分配。 WUI_Builder賦予開發人員的權力，以決定何時應呈現組件。它允許開發人員可以決定組件是在動畫框架上還是在和閒置回調的上方更新。理想情況下，組件將要么：

• 在動畫框架上渲染必須完成的高優先級更新。可以在動畫框架上批量構成Mulitiple組件的更新。
• 在空閒回調上渲染可用於低優先級更新，這些更新可以跨幀分開。

但是，還允許同步更新按需運行，而無需等待動畫框架或空閒回調。

智能更新批處理

最後，當對同一組件的多個更新在任何可以處理之前排隊時，WUI_Builder會防止不執行的更新。例如，假設我有一個使用SetStateonAnimationFrame在動畫框架上更新的組件。如果SetStateOnAnimationFrame在幀之間兩次調用，則更新過程只能運行一次，同時允許執行兩個狀態設置器功能。

注意，當前所有瀏覽器當前尚未支持requestIdleCallback，而WUI_Builder此時不包括Polyfill。同步渲染仍然適用於所有瀏覽器。請參閱此處的兼容性圖表。

句法

 class HelloWorldProps {
    final String text;
    HelloWorldProps ( this .text);
}

class HelloWorld extends PComponent < HelloWorldProps > {
    HelloWorld ( String text) : super ( HelloWorldProps (text));

    @override
    VNode render () => VDivElement ()
        ..text = props.text;
}

// instantiate the component, pass it an instance of HelloWorldProps
final component = HelloWorld ( 'Hello world' );

// render the virtual element into a container
render (component, querySelector ( '#container' ));

在GitHub頁面上查看文檔，以獲取更多深度示例。