Skip to content

IGX Datagrid autosize feature with performance improvements #10205

@BotanicalGarden

Description

@BotanicalGarden

Is your feature request related to a problem? Please describe.

We are using IGX Grid in Angular with numerous rows and columns. Our grids are required to have all columns autosized once data is loaded. We do this by manually calling column.autosize and notice that is a performance bottleneck, sometimes taking up to 2.5 seconds to complete for a particularly large datagrid. This frustrates the user, especially when there are numerous datagrids being displayed and autosized.

Describe the solution you'd like

We'd like:

  1. A feature that automatically has the datagrid columns autosized when data is loaded. E.g. @Input autosize: boolean on the igx-grid component.
  2. We require the autosize to be fairly quick and unnoticeable to the user.

Describe alternatives you've considered

We have made our own performance improvements on the IGX datagrid by avoiding datagrid.reflow() from being called until all columns have been resized. Please see our stackblitz example to compare the old way to our new way:
https://stackblitz.com/edit/github-jxvrgd-9sbr3f?file=src/app/grid/grid-resizing-sample/grid-resizing-sample.component.ts
We'd like this performance to be further improved. We've found that the main bottleneck is happening in the column.getAutoSize() method.

Additional context

Product Details
COMPONENT / igx-grid
PLATFORM / Angular
BUILD NUMBER / 10.2.24

Metadata

Metadata

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions