Skip to content

Commit

Permalink
perf(DataTable): speed up select-all with large tables
Browse files Browse the repository at this point in the history
Rewrite `setAllSelectedState` to improve peformance with
large tables. In my test case with 10000 rows, selecting
all rows previously took 14000ms. This fix reduces it to
8ms. It uses one instance of (local) variable mutation.
Fixes #6146.

.
  • Loading branch information
Earle Castledine committed May 19, 2023
1 parent fd273d3 commit d77e1c1
Showing 1 changed file with 9 additions and 12 deletions.
21 changes: 9 additions & 12 deletions packages/react/src/components/DataTable/DataTable.js
Original file line number Diff line number Diff line change
Expand Up @@ -486,19 +486,16 @@ class DataTable extends React.Component {
*/
setAllSelectedState = (initialState, isSelected, filteredRowIds) => {
const { rowIds } = initialState;
const isFiltered = rowIds.length != filteredRowIds.length;
return {
rowsById: rowIds.reduce(
(acc, id) => ({
...acc,
[id]: {
...initialState.rowsById[id],
...(!initialState.rowsById[id].disabled && {
isSelected: filteredRowIds.includes(id) && isSelected,
}),
},
}),
{}
),
rowsById: rowIds.reduce((acc, id) => {
const row = { ...initialState.rowsById[id] };
if (!row.disabled && (!isFiltered || filteredRowIds.includes(id))) {
row.isSelected = isSelected;
}
acc[id] = row; // Local mutation for performance with large tables
return acc;
}, {}),
};
};

Expand Down

0 comments on commit d77e1c1

Please sign in to comment.