glideapps / glide-data-grid

🚀 Glide Data Grid is a no compromise, outrageously react fast data grid with rich rendering, first class accessibility, and full TypeScript support.
https://grid.glideapps.com
MIT License
3.98k stars 288 forks source link

Improve Performance in Row Grouping #924

Open bkorobeinikov opened 6 months ago

bkorobeinikov commented 6 months ago

There is a performance bottleneck when using the row grouping feature. It is noticeable with a large number of rows and about >~20 groups or so.

Profiler showed that the call to mapRowIndexToPath during row height resolution takes most of the time, and it gets slower scrolling towards the end of the list.

rowIndex property was added to identify the exact position of the group in the list. This allowed to create a map that then could be looked up to identify whether the row is a group row or not and resolve the height accordingly, avoiding the expensive call to mapRowIndexToPath.

For further performance improvements, with rowIndex property functions like rowNumberMapperOut and mapRowIndexToPath could be changed to do a binary search, because mapRowIndexToPath can be used as mapper function in the getCellContent consumer code.

scrolling profiler recordings:

before change image

after image

related to https://github.com/glideapps/glide-data-grid/issues/823

theiliad commented 3 months ago

@jassmith I'm curious if this has been reviewed? I'm also having issues with large resource clogs when using row grouping