0

I have a requirement where we need to show around 24k records which has 84 cols in one go, as user wants filtering on entire set of data.

So can we have virtual scrolling mechanism with ag-grid without lazy loading?? If so could you please here. Any example are most welcome for reference.

Vandana Chaurse
  • 1
  • 3

1 Answers1

0

Having tried this sort of thing with a similar number of rows and columns, I've found that it's just about impossible to get reasonable performance, especially if you are using things like "framework" renderers. And if you enable grouping, you're going to have a bad time.

What my team has done to enable filtering and sorting across an entire large dataset includes:

  • We used the client-side row model - the grid's simplest mode

  • We only load a "page" of data at a time. This involves trial and error with a reasonable sample of data and the actual features that you are using to arrive at the maximum page size that still allows the grid to perform well with respect to scrolling / rendering.

  • We implemented our own paging. This includes display of a paging control, and fetching the next/previous page from the server. This obviously requires server-side support. From an ag-grid point of view, it is only ever managing one page of data. Each page gets completely replaced with the next page via round-trip to the server.

  • We implemented sorting and filtering on the server side. When the user sorts or filters, we catch the event, and send the sort/filter parameters to the server, and get back a new page. When this happens, we revert to page 0 (or page 1 in user parlance). This fits in nicely with support for non-grid filters that we have elsewhere in the page (in our case, a toolbar above the grid).

  • We only enable grouping when there is a single page of data, and encourage our users to filter their data to get down to one page of data so that they can group it. Depending on the data, page size might be as high as 1,000 rows. Again, you have to arrive at page size on a case-by-case basis.

So, in short, when we have the need to support filtering/sorting over a large dataset, we do all of the performance-intensive bits on the server side.

I'm sure that others will argue that ag-grid has a lot of advanced features that I'm suggesting that you not use. And they would be correct, for small-to-medium sized datasets, but when it comes to handling large datasets, I've found that ag-grid just can't handle it with reasonable performance.

GreyBeardedGeek
  • 29,460
  • 2
  • 47
  • 67
  • I will try to check if we can achieve this. As you mentioned it will be very tough if we ahve grouping enable, we dont have grouping feature for our reporting just want filtering and sorting feature. Any other component you think of by which we can achieve this virtual scrolling and filtering and sorting together? – Vandana Chaurse Apr 27 '20 at 06:54
  • If you are not grouping, you should be fine with ag-grid. Also, I remembered that when I ran into performance problems, it was because I had column virtualization turned off, and a very large rowbuffer (to effectively turn off row virtualization), because we have accessibility requirements that mean we have to have all of the data in the DOM (think screen readers). If you leave virtualization on, you should be fine for filtering and sorting, not sure about grouping. – GreyBeardedGeek Apr 27 '20 at 13:13