Unplanned
Last Updated: 20 Oct 2022 13:33 by ADMIN
Kendo UI
Created on: 20 Oct 2022 13:22
Category: Grid
Type: Feature Request
2
[Grid] Support for virtual scrolling with very large data sets

As there are browser-specific limitations to the maximum reliable height/width an HTML element can have (https://stackoverflow.com/questions/34931732/height-limitations-for-browser-vertical-scroll-bar), the virtual scrolling functionality of the Grid is affected (different issues appear depending on the browser).

It would be a nice enhancement to provide a way the virtual scrolling to work regardless of the total number of items in a given use case.

A possible solution is to keep track of a virtual window from 1 to 1,000,000 if the number of source records is greater than 1 million. On a scroll event, the scroll position can then be adjusted to reflect the position within the actual data set. For example, if the scroll position is 300,000 (within the max of 1,000,000) and the source data contains 50,000,000 records, the actual record index to start displaying data is 300000 / 1000000 * 50000000 = 15000000.

Workaround:

The Grid can use virtual scrolling feature with pager.

While the Grid built-in paging and virtual scrolling functionalities are alternatives for rendering the Grid data in portions (pages) they cannot be used together as they both rely on the same pageChange event to process the data.

The developer can introduce some custom implementation based on a custom paging UI placed below the Grid or in the Grid Toolbar template, for example the dedicated stand-alone Pager component.

Here is an example featuring a Grid that has 500k items per page (total 1 million). Each page utilizes virtual scrolling with pageSize=100:

https://stackblitz.com/edit/grid-paged-virtual-scrolling
0 comments