Client Render on Demand

This documentation is for an older version of ZK. For the latest one, please click here.

[Enterprise Edition]
[Since 5.0.0]

With Enterprise Edition, widgets 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.

---

Client ROD: Tree

Client ROD is enabled only if a tree item is closed. Thus, to have the best performance (particularly for a huge tree), it is better to make all tree item closed initially.

<treeitem forEach="${data}" open="false">
	<treerow>
		<treecell label="${each.name}"/>
		<treecell label="${each.description}"/>
	</treerow>
    <treechildren>
        <treeitem forEach="${each.detail}" open="false">
			<treerow>
				<treecell label="${each.name}"/>
				<treecell label="${each.description}"/>
			</treerow>
            <treechildren>
                <treeitem forEach="${each.fine}" open="false">
					<treerow>
						<treecell label="${each.name}"/>
						<treecell label="${each.description}"/>
					</treerow>
				</treeitem>
			</treechildren>
		</treeitem>
	</treechildren>
</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.

Enable or Disable Client ROD

If you want to disable Client ROD for the whole application, you can specify a library property called rod with false. For example, specify the following in zk.xml:

<library-property>
	<name>org.zkoss.zul.client.rod</name>
	<value>false</value>
</library-property>

Or, if you prefer to disable it for a particular page, then specify false to a page's attribute called rod, such as

<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,

<window>
  <custom-attributes org.zkoss.zul.client.rod="false"/> <!-- disable it for descendants of window -->
  <div>
    <custom-attributes org.zkoss.zul.client.rod="true"/> <!-- enable it for descendants of div -->
..
  </div>
</window>