Grid load on demand when scrolling

asked 2013-10-20 00:55:07 +0800

mariannadikaiakou gravatar image mariannadikaiakou

updated 2013-10-20 12:14:12 +0800


I'm developing a project in ZK and I'm facing very big performance issues with the grid component. A few details are included below: In one of my pages I have a grid of 350 rows and 25 columns. Each row has 3 event listeners and the grid also has a row of auxiliary headers with multi-select filters. When using paging (15 rows/page) the page takes approx. 4sec the first time it loads and then is much faster when navigating through the pages. Unfortunately, the use of paging is not an option and the whole dataset needs to be present in the page so the user is able to scroll up/down through the data. When I remove paging, the grid becomes unresponsive - presumably trying to render all 350 rows. If I interrupt loading, I observe that not all rows are rendered and not all event listeners registered.

In an attempt to see what slows down the page I removed all event listeners from the page and even removed the row of aux.headers but the grid was still very slow to render.

I also tried the ZK EE evaluation version but there seems to be no difference in behaviour. The model of the grid is backed by a ListModelList in a ViewModel. I made no changes to the .zul or ViewModel while trying the ZK EE evaluation component because the examples of grid and listbox load-on-demand show no difference in the ViewModel and Composer than what would be used in the CE version. So it seems that even with ZK EE the grid is loading all 350 records.

Is there something I should change in the ListModel or the grid to make it load-on-demand? As I wrote above, I switched to the EE modules for evaluation. Should I load the grid model from a Composer instead of a ViewModel to enable load-on-demand?

Any help is greatly appreciated!

Edit: Some additional info: I'm using a custom row renderer. I added a debug statement to see how long the row renderer takes to complete for all 350 rows and it takes approx 4sec. The page stays unresponsive for at least 3-4 mins, with ZK EE. So the data is sent to the client fast but then takes ages to process all the JS?

I think that if the grid becomes load-on-demand, all problems will be solved. I may be missing something trivial in achieving this, any thoughts? Any configuration I may have missed?

delete flag offensive retag edit

1 Answer

Sort by ยป oldest newest most voted

answered 2013-10-23 00:29:37 +0800

mariannadikaiakou gravatar image mariannadikaiakou

updated 2013-10-24 10:34:51 +0800

sjoshi gravatar image sjoshi flag of India
3493 1 8

It seems I was indeed missing important configuration. Load-on-demand is disabled by default in ZK - probably because it is a feature of EE. To enable it (for a grid) one has 2 options:
1. Edit WEB-INF/zk.xml and add:

  1. Inside the zul add:

    <custom-attributes org.zkoss.zul.grid.rod="true" org.zkoss.zul.grid.initrodsize="25"><custom-attributes/>

ALSO, as explained in ZK 6 Grid API documentation,

Note that ROD works only if the Grid is configured to has a limited "view port" height.


link publish delete flag offensive edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

1 follower



Asked: 2013-10-20 00:55:07 +0800

Seen: 50 times

Last updated: Oct 24 '13

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More