Client Render on Demand
- Available for ZK:
[Since 5.0.0]
With Enterprise Edition, widgets[1] will delay the rendering of DOM elements until really required. For example, the DOM elements of comboitem
won't be created until the drop down is shown up. It improved the performance a lot for a sophisticated user interface.
This feature is transparent to the application developers. All widgets are still instantiated (though DOM elements might not), so they can be accessed without knowing if this feature is turned on.
- ↑ A widget is the (JavaScript) object running at the client to represent a component
Client ROD: Tree
A tree node only renders its children node's DOM elements when it's open. If you close the node, it will remove those DOM elements. Thus, to have the best performance (particularly for a huge tree), it is better to make all tree item closed initially. You can observe this behavior with developer tool.
1 <treeitem forEach="${data}" open="false">
2 <treerow>
3 <treecell label="${each.name}"/>
4 <treecell label="${each.description}"/>
5 </treerow>
6 <treechildren>
7 <treeitem forEach="${each.detail}" open="false">
8 <treerow>
9 <treecell label="${each.name}"/>
10 <treecell label="${each.description}"/>
11 </treerow>
12 <treechildren>
13 <treeitem forEach="${each.fine}" open="false">
14 <treerow>
15 <treecell label="${each.name}"/>
16 <treecell label="${each.description}"/>
17 </treerow>
18 </treeitem>
19 </treechildren>
20 </treeitem>
21 </treechildren>
22 </treeitem>
Client ROD: Groupbox
Client ROD is enabled only if a groupbox is closed. Thus, to have the best performance (particularly with sophisticated content), it is better to make the groupbox closed initially if proper.
Client ROD: Panel
Client ROD is enabled only if a panel is closed. Thus, to have the best performance (particularly for with sophisticated content), it is better to make the panel closed initially if proper.
Client ROD: Tabbox
Client ROD is enabled for the invisible tabpanels. After the tabpanel becomes active, its content will be rendered and attached to the DOM tree.
Client ROD: Organigram
Client ROD is enabled only if an orgitem is closed. Thus, to have the best performance (particularly with sophisticated content), it is better to make the orgitem closed initially if proper.
Enable or Disable Client ROD
If you want to disable Client ROD for the whole application, you can specify a library property called org.zkoss.zul.client.rod
rod with false. For example, specify the following in zk.xml:
1 <library-property>
2 <name>org.zkoss.zul.client.rod</name>
3 <value>false</value>
4 </library-property>
Or, if you prefer to disable it for a particular page, then specify false to a page's attribute called org.zkoss.zul.client.rod
rod, such as
1 <custom-attributes org.zkoss.zul.client.rod="false" scope="page"/>
Or, if you prefer to disable it for all descendants of a particular component, then specify false to a component's attribute. And, you can enable it for a subset of the descendants. For example,
1 <window>
2 <custom-attributes org.zkoss.zul.client.rod="false"/> <!-- disable it for descendants of window -->
3 <div>
4 <custom-attributes org.zkoss.zul.client.rod="true"/> <!-- enable it for descendants of div -->
5 ..
6 </div>
7 </window>
Version History
Version | Date | Content |
---|---|---|