Turn on Render on Demand"

From Documentation
m
Line 1: Line 1:
−
{{ZKDevelopersGuidePageHeader}}
+
{{ZKDevelopersReferencePageHeader}}
  
 
__TOC__
 
__TOC__
Line 6: Line 6:
 
  [Since 5.0.0]
 
  [Since 5.0.0]
  
−
With ZK　EE, you can enable <b>Render on Demand</b> for Grid and Listbox to boost performance in showing huge data. Grid and Listbox will load only the necessary data chunk from associated ListModel, render required Row(s)/Listitem(s) in server,  then create only required corresponding widgets and render the DOM elements really needed in browser. It improves the performance and saves memory significantly in both server and browser sides.
+
With ZK EE, you can enable <b>Render on Demand</b> for Grid and Listbox to boost performance in showing huge data. Grid and Listbox will load only the necessary data chunk from associated ListModel, render required Row(s)/Listitem(s) in server,  then create only required corresponding widgets and render the DOM elements really needed in browser. It improves the performance and saves memory significantly in both server and browser sides.
  
 
<blockquote>
 
<blockquote>
Line 13: Line 13:
 
</blockquote>
 
</blockquote>
  
−
=== ROD: Grid ===
+
= ROD: Grid =
 
If you want to enable Grid ROD for the whole application, you can specify a library property called <javadoc>org.zkoss.zul.grid</javadoc> rod with <tt>true</tt>. For example, specify the following in zk.xml:
 
If you want to enable Grid ROD for the whole application, you can specify a library property called <javadoc>org.zkoss.zul.grid</javadoc> rod with <tt>true</tt>. For example, specify the following in zk.xml:
  
−
<source lang="xml">
+
<syntax lang="xml">
 
<library-property>
 
<library-property>
 
<name>org.zkoss.zul.grid.rod</name>
 
<name>org.zkoss.zul.grid.rod</name>
 
<value>true</value>
 
<value>true</value>
 
</library-property>
 
</library-property>
−
</source>
+
</syntax>
  
 
Or, if you prefer to enable it for a particular page, then specify <tt>true</tt> to a page's attribute called <javadoc>org.zkoss.zul.grid</javadoc> rod, such as
 
Or, if you prefer to enable it for a particular page, then specify <tt>true</tt> to a page's attribute called <javadoc>org.zkoss.zul.grid</javadoc> rod, such as
  
−
<source lang="xml">
+
<syntax lang="xml">
 
<custom-attributes org.zkoss.zul.grid.rod="true" scope="page"/>
 
<custom-attributes org.zkoss.zul.grid.rod="true" scope="page"/>
−
</source>
+
</syntax>
  
 
Or, if you prefer to enable it for all descendant grids of a particular component, then specify <tt>true</tt> to the component's attribute. And, you can enable it for a subset of the descendant grids. For example,
 
Or, if you prefer to enable it for all descendant grids of a particular component, then specify <tt>true</tt> to the component's attribute. And, you can enable it for a subset of the descendant grids. For example,
  
−
<source lang="xml">
+
<syntax lang="xml">
 
<window>
 
<window>
 
   <custom-attributes org.zkoss.zul.grid.rod="true"/> <!-- enable it for descendant grids of window -->
 
   <custom-attributes org.zkoss.zul.grid.rod="true"/> <!-- enable it for descendant grids of window -->
Line 45: Line 45:
 
   </div>
 
   </div>
 
</window>
 
</window>
−
</source>
+
</syntax>
  
 
Note that Grid ROD is not working unless the Grid is configured with a limited <b>view port</b>; i.e. you have to set <tt>height</tt> or <tt>vflex</tt> attribute of the Grid or set the Grid to <tt>paging</tt> mold so the user see only a portion of the content of the Grid.
 
Note that Grid ROD is not working unless the Grid is configured with a limited <b>view port</b>; i.e. you have to set <tt>height</tt> or <tt>vflex</tt> attribute of the Grid or set the Grid to <tt>paging</tt> mold so the user see only a portion of the content of the Grid.
  
−
=== ROD: Listbox ===
+
= ROD: Listbox =
 
If you want to enable Listbox ROD for the whole application, you can specify a library property called <javadoc>org.zkoss.zul.listbox</javadoc> rod with <tt>true</tt>. For example, specify the following in zk.xml:
 
If you want to enable Listbox ROD for the whole application, you can specify a library property called <javadoc>org.zkoss.zul.listbox</javadoc> rod with <tt>true</tt>. For example, specify the following in zk.xml:
  
−
<source lang="xml">
+
<syntax lang="xml">
 
<library-property>
 
<library-property>
 
<name>org.zkoss.zul.listbox.rod</name>
 
<name>org.zkoss.zul.listbox.rod</name>
 
<value>true</value>
 
<value>true</value>
 
</library-property>
 
</library-property>
−
</source>
+
</syntax>
  
 
Or, if you prefer to enable it for a particular page, then specify <tt>true</tt> to a page's attribute called <javadoc>org.zkoss.zul.listbox</javadoc> rod, such as
 
Or, if you prefer to enable it for a particular page, then specify <tt>true</tt> to a page's attribute called <javadoc>org.zkoss.zul.listbox</javadoc> rod, such as
  
−
<source lang="xml">
+
<syntax lang="xml">
 
<custom-attributes org.zkoss.zul.listbox.rod="true" scope="page"/>
 
<custom-attributes org.zkoss.zul.listbox.rod="true" scope="page"/>
−
</source>
+
</syntax>
  
 
Or, if you prefer to enable it for all descendant listboxs of a particular component, then specify <tt>true</tt> to the component's attribute. And, you can enable it for a subset of the descendant listboxs. For example,
 
Or, if you prefer to enable it for all descendant listboxs of a particular component, then specify <tt>true</tt> to the component's attribute. And, you can enable it for a subset of the descendant listboxs. For example,
  
−
<source lang="xml">
+
<syntax lang="xml">
 
<window>
 
<window>
 
   <custom-attributes org.zkoss.zul.listbox.rod="true"/> <!-- enable it for descendant listboxs of window -->
 
   <custom-attributes org.zkoss.zul.listbox.rod="true"/> <!-- enable it for descendant listboxs of window -->
Line 81: Line 81:
 
   </div>
 
   </div>
 
</window>
 
</window>
−
</source>
+
</syntax>
  
 
Note that Listbox ROD is not working unless the Listbox is configured with a limited <b>view port</b>; i.e. you have to set <tt>height</tt>, <tt>vflex</tt>, or <tt>rows</tt> attribute of the Listbox or set the Listbox to <tt>paging</tt> mold so the user see only a portion of the content of the Listbox.
 
Note that Listbox ROD is not working unless the Listbox is configured with a limited <b>view port</b>; i.e. you have to set <tt>height</tt>, <tt>vflex</tt>, or <tt>rows</tt> attribute of the Listbox or set the Listbox to <tt>paging</tt> mold so the user see only a portion of the content of the Listbox.
  
−
{{ ZKDevelopersGuidePageFooter}}
+
=Version History=
 +
 
 +
{| border='1px' | width="100%"
 +
! Version !! Date !! Content
 +
|-
 +
| &nbsp;
 +
| &nbsp;
 +
| &nbsp;
 +
|}
 +
 
 +
{{ ZKDevelopersReferencePageFooter}}

Revision as of 11:37, 17 September 2010


DocumentationZK Developer's ReferencePerformance TipsListbox, Grid and Tree for Huge DataTurn on Render on Demand
Turn on Render on Demand


[ZK EE]
[Since 5.0.0]

With ZK EE, you can enable Render on Demand for Grid and Listbox to boost performance in showing huge data. Grid and Listbox will load only the necessary data chunk from associated ListModel, render required Row(s)/Listitem(s) in server, then create only required corresponding widgets and render the DOM elements really needed in browser. It improves the performance and saves memory significantly in both server and browser sides.

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

Note that Grid ROD is not working unless the Grid is configured with a limited view port; i.e. you have to set height or vflex attribute of the Grid or set the Grid to paging mold so the user see only a portion of the content of the Grid.

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>

Note that Listbox ROD is not working unless the Listbox is configured with a limited view port; i.e. you have to set height, vflex, or rows attribute of the Listbox or set the Listbox to paging mold so the user see only a portion of the content of the Listbox.

Version History

Version Date Content
     



Last Update : 2010/09/17

Copyright © Potix Corporation. This article is licensed under GNU Free Documentation License.


Retrieved from "https://www.zkoss.org/_w/index.php?title=ZK_Developer%27s_Reference/Performance_Tips/Listbox,_Grid_and_Tree_for_Huge_Data/Turn_on_Render_on_Demand&oldid=7143"