Skip to content

Commit

Permalink
perf: don't invalidate grid rows more than once, fixes #1678
Browse files Browse the repository at this point in the history
  • Loading branch information
ghiscoding committed Sep 14, 2024
1 parent ac7e6f9 commit a5b9647
Show file tree
Hide file tree
Showing 2 changed files with 11 additions and 5 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -247,6 +247,7 @@ const mockGrid = {
getContainerNode: vi.fn(),
getGridPosition: vi.fn(),
getOptions: vi.fn(),
getRenderedRange: vi.fn(),
getSelectionModel: vi.fn(),
getScrollbarDimensions: vi.fn(),
updateRow: vi.fn(),
Expand Down Expand Up @@ -1806,6 +1807,7 @@ describe('Slick-Vanilla-Grid-Bundle Component instantiated via Constructor', ()
it('should update each row and re-render the grid when filtering and DataView "onRowsChanged" event is triggered', () => {
const renderSpy = vi.spyOn(mockGrid, 'render');
const updateRowSpy = vi.spyOn(mockGrid, 'updateRow');
vi.spyOn(mockGrid, 'getRenderedRange').mockReturnValue({ bottom: 10, top: 0, leftPx: 0, rightPx: 890 });

component.gridOptions = { enableFiltering: true };
component.initialization(divContainer, slickEventHandler);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -831,12 +831,16 @@ export class SlickVanillaGridBundle<TData = any> {
}
});

// when filtering data with local dataset, we need to update each row else it will not always show correctly in the UI
// also don't use "invalidateRows" since it destroys the entire row and as bad user experience when updating a row
if (gridOptions?.enableFiltering && !gridOptions.enableRowDetailView) {
this._eventHandler.subscribe(dataView.onRowsChanged, (_e, args) => {
if (args?.rows && Array.isArray(args.rows)) {
args.rows.forEach((row: number) => grid.updateRow(row));
this._eventHandler.subscribe(dataView.onRowsChanged, (_e, { calledOnRowCountChanged, rows }) => {
// filtering data with local dataset will not always show correctly unless we call this updateRow/render
// also don't use "invalidateRows" since it destroys the entire row and as bad user experience when updating a row
// see commit: https://github.com/ghiscoding/aurelia-slickgrid/commit/8c503a4d45fba11cbd8d8cc467fae8d177cc4f60
if (!calledOnRowCountChanged && Array.isArray(rows)) {
const ranges = grid.getRenderedRange();
rows
.filter(row => row >= ranges.top && row <= ranges.bottom)
.forEach((row: number) => grid.updateRow(row));
grid.render();
}
});
Expand Down

0 comments on commit a5b9647

Please sign in to comment.