Turn on Render on Demand"
Line 100: | Line 100: | ||
</syntax> | </syntax> | ||
− | Note that Listbox ROD is not working unless the Listbox is configured with a limited <b> | + | == Fixed Viewport is Required == |
+ | Fixed Viewport is Required | ||
+ | Note that Grid ROD will not work unless the Grid is configured with a limited view port, so the user can see only a portion of rows; i.e. you have to set one of the following attributes: | ||
+ | Note that Listbox ROD is not working unless the Listbox is configured with a limited <b>viewport</b>, so the user can see only a portion of listitems; i.e. you have to set one of the following attributes: | ||
+ | |||
+ | * <tt>height</tt> | ||
+ | * <tt>vflex</tt> | ||
+ | * <tt>rows</tt> | ||
+ | * <tt>mold="paging"</tt> | ||
== Specifies the number of items rendered == | == Specifies the number of items rendered == |
Revision as of 06:07, 24 September 2020
[ZK EE] [Since 5.0.0]
With ZK EE, you can enable Render on Demand for Grid and Listbox to boost performance to show huge amount of data. Grid and Listbox will load only the necessary data chunk from associated ListModel, render required Row(s)/Listitem(s) on the server, then create only the required corresponding widgets and render the DOM elements really needed in browser. It improves the performance and saves memory significantly on both the server and browser sides.
Note: ROD actually brings performance boost on both the client side and server side. However, if you use forEach to populate Rows or Listitems, the components will be all in memory, which does not give you any performance benefits on server side. (The client side still enjoys a boost.) If you want to fully leverage the power of ROD, the use of model is recommended.
ROD: Grid
If you want to enable Grid ROD for the whole application, you can specify a library property called Grid rod with true. For example, specify the following in zk.xml:
<syntax lang="xml"> <library-property> <name>org.zkoss.zul.grid.rod</name> <value>true</value> </library-property> </syntax>
Or, if you prefer to enable it for a particular page, then specify true to a page's attribute called Grid rod, such as
<syntax lang="xml"> <custom-attributes org.zkoss.zul.grid.rod="true" scope="page"/> </syntax>
Or, if you prefer to enable it for all descendant grids of a particular component, then specify true to the component's attribute. You can enable it for a subset of the descendant grids. For example,
<syntax lang="xml"> <window>
<custom-attributes org.zkoss.zul.grid.rod="true"/> <grid ...> .. </grid>
<custom-attributes org.zkoss.zul.grid.rod="false"/> <grid ...> .. </grid> ..
</window> </syntax>
Fixed Viewport is Required
Note that Grid ROD will not work unless the Grid is configured with a limited view port, so the user can see only a portion of rows; i.e. you have to set one of the following attributes:
- height
- vflex
- mold="paging"
Specifies the number of rows rendered
[default: 100] [inherit: true] [since 5.0.8]
Specifies the minimum number of rows rendered on the client. It is only considered if Grid is using live data (Grid.setModel(ListModel)) and not using paging mold (Grid.getPagingChild()). <syntax lang="xml"> <custom-attributes org.zkoss.zul.grid.initRodSize="30"/> </syntax>
ROD: Listbox
If you want to enable Listbox ROD for the whole application, you can specify a library property called Listbox rod with true. For example, specify the following in zk.xml:
<syntax lang="xml"> <library-property> <name>org.zkoss.zul.listbox.rod</name> <value>true</value> </library-property> </syntax>
Or, if you prefer to enable it for a particular page, then specify true to a page's attribute called Listbox rod, such as
<syntax lang="xml"> <custom-attributes org.zkoss.zul.listbox.rod="true" scope="page"/> </syntax>
Or, if you prefer to enable it for all descendant listboxs of a particular component, then specify true to the component's attribute. And, you can enable it for a subset of the descendant listboxs. For example,
<syntax lang="xml"> <window>
<custom-attributes org.zkoss.zul.listbox.rod="true"/> <listbox ...> .. </listbox>
<custom-attributes org.zkoss.zul.listbox.rod="false"/> <listbox ...> .. </listbox> ..
</window> </syntax>
Fixed Viewport is Required
Fixed Viewport is Required Note that Grid ROD will not work unless the Grid is configured with a limited view port, so the user can see only a portion of rows; i.e. you have to set one of the following attributes: Note that Listbox ROD is not working unless the Listbox is configured with a limited viewport, so the user can see only a portion of listitems; i.e. you have to set one of the following attributes:
- height
- vflex
- rows
- mold="paging"
Specifies the number of items rendered
[default: 100] [inherit: true] [since 5.0.8]
Specifies the number of items rendered when the Listbox first render. It is used only if live data (Listbox.setModel(ListModel)) and not paging (Listbox.getPagingChild()). <syntax lang="xml"> <custom-attributes org.zkoss.zul.listbox.initRodSize="30"/> </syntax>
Version History
Version | Date | Content |
---|---|---|