Defer the Creation of Child Components"

From Documentation
m ((via JWB))
Line 3: Line 3:
 
For sophisticated pages, the performance can be improved if we defer the creation of child components until they are becoming visible. The simplest way to do this  is by the use of the <tt>fulfill</tt> attribute. In the following example, the children of the second tab panel are created only if it becomes visible.
 
For sophisticated pages, the performance can be improved if we defer the creation of child components until they are becoming visible. The simplest way to do this  is by the use of the <tt>fulfill</tt> attribute. In the following example, the children of the second tab panel are created only if it becomes visible.
  
<syntax lang="xml" >
+
<syntaxhighlight line lang="xml" >
 
<tabbox>
 
<tabbox>
 
     <tabs>
 
     <tabs>
Line 18: Line 18:
 
     </tabpanels>
 
     </tabpanels>
 
</tabbox>
 
</tabbox>
</syntax>
+
</syntaxhighlight>
  
 
For more information, please refer to the [[ZK Developer's Reference/UI Composing/ZUML/On-demand Evaluation|On-demand Evaluation]] section.
 
For more information, please refer to the [[ZK Developer's Reference/UI Composing/ZUML/On-demand Evaluation|On-demand Evaluation]] section.

Revision as of 08:59, 24 June 2021


DocumentationZK Developer's ReferencePerformance TipsDefer the Creation of Child Components
Defer the Creation of Child Components


For sophisticated pages, the performance can be improved if we defer the creation of child components until they are becoming visible. The simplest way to do this is by the use of the fulfill attribute. In the following example, the children of the second tab panel are created only if it becomes visible.

 1 <tabbox>
 2     <tabs>
 3         <tab label="Preload" selected="true"/>
 4         <tab id="tab2" label="OnDemand"/>
 5     </tabs>
 6     <tabpanels>
 7         <tabpanel>
 8 			This panel is pre-loaded since no fulfill specified
 9         </tabpanel>
10         <tabpanel fulfill="self.linkedTab.onSelect">
11 			This panel is loaded only tab2 receives the onSelect event
12         </tabpanel>
13     </tabpanels>
14 </tabbox>

For more information, please refer to the On-demand Evaluation section.

Version History

Last Update : 2021/06/24


Version Date Content
     



Last Update : 2021/06/24

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