AG Grid v27 - suppressRowVirtualization loads every page instantly

Viewed 60

I have a grid that uses serverSide pagination & serverSideStoreType="partial" since I updated ag-grid to v27 from v24.

I want to use suppressRowVirtualisation="true" because scrolling reduces performance heavily, however, setting that option to true seems to load data for all my pages without waiting for the user to scroll at the bottom of the declared cacheBlockSize.

Is there a way to make suppressRowVirtualisation work alongside serverSide pagination?

All help is appreciated!

<ag-grid-angular #stopPointsGrid style="width: 100%; height: 100%;" class="ag-theme-material" [modules]="modules"
    [columnDefs]="columnDefs" suppressCellFocus="true" suppressHorizontalScroll="true" rowSelection="multiple"
    [rowModelType]="rowModelType" [cacheBlockSize]="cacheBlockSize" suppressRowClickSelection="true"
    serverSideStoreType="partial" suppressColumnVirtualisation="true" suppressRowVirtualisation="true"
    (gridReady)="onGridReady($event)" (rowClicked)="rowClicked($event)" [isFullWidthRow]="gridsService.isFullWidthRow"
    [fullWidthCellRenderer]="gridsService.fullWidthCellRenderer" [suppressDragLeaveHidesColumns]="true">
  </ag-grid-angular>
1 Answers

To me this sounds like suppressRowVirtualisation=true works as expected.

If you look at the docs at https://www.ag-grid.com/javascript-data-grid/dom-virtualisation/#suppress-virtualisation

Note if suppressRowVirtualisation=true, then there is no Row Buffer and the rowBuffer property is ignored.

Which means if you turn off row virtualisation your entire table will be rendered in the DOM.

What do you mean by scrolling reduces performance? I build big grids and scrolling and loading async works perfectly fine. You maybe can look at:

  • adjust your buffer size when new entries are loaded
  • improve your api if requests are too slow
  • if you use custom cell renderer improve their performance and understand how refresh works
Related