Grid Performance & Virtual Scrolling

[Edward]

We're looking to improve the performance of the KendoUI Grid when rendering large data sets with client filtering & pagination. Is it possible to get virtual scrolling with client side pagination, where the scrolling is finite and limited to the current page size (yet still takes advantage of the virtual rendering).

Essentially, we want to take advantage of the virtual DOM rendering, but not the infinite scrolling and data fetching. Otherwise, is there a way to override the renderer to use another rendering library.

Also, is there a way to dynamically set the pageSize depending on the maximum number of visible rows. I.e.

pageSize = Math.floor(gridHeight / rowHeight)

[Alexander Valchev]

Hello Edward,

It is possible to have virtual scrolling with client side paging but it is not possible to limit the scrolling to the current page. The pageSize determines the size of the data chunk that will be loaded.

If you want to limit the amount of records that will be loaded just pass them as data to the DataSource. For example if you have total 1000 records but want to make a finite scrolling to 500 records with 50 pageSize, you have to set the pageSize of the dataSource to 50 and the data of the dataSource to the first 500 records of the 1000 records data set.

If you want to change the amount of the data you may use the data method of the DataSource to replace the current 500 records with others.

I would not recommend overriding the render method. The pageSize should not be exactly the same amount as the currently visible rows. In order to get a smooth scrolling you will need a pageSize bigger than the amount of records that the users sees.

Regards,
Alexander Valchev
Telerik