[data grid] Performance: selectors #18234

romgrk · 2025-06-04T23:19:09Z

Import the selectors implementation from base-ui.

romgrk · 2025-06-04T23:22:11Z

packages/x-data-grid/src/hooks/features/preferencesPanel/gridPreferencePanelSelector.ts

 export const gridPreferencePanelSelectorWithLabel = createSelector(
  gridPreferencePanelStateSelector,
-  (panel, labelId: string) => {
+  (panel, labelId: string | undefined) => {


The typings from the base-ui selector functions are more precise, they can catch more issues.

mui-bot · 2025-06-04T23:22:30Z

Deploy preview: https://deploy-preview-18234--material-ui-x.netlify.app/

Bundle size report

Total Size Change:^{${\tiny{\color{green}▼}}$}-1.69KB^(-0.01%) - Total Gzip Change:^{${\tiny{\color{red}▲}}$}+628B^(+0.02%)
Files: 120 total (0 added, 0 removed, 6 changed)

@mui/x-data-grid-pro parsed:^{${\tiny{\color{green}▼}}$}-612B^(-0.13%) gzip:^{${\tiny{\color{red}▲}}$}+112B^(+0.09%)
@mui/x-data-grid-premium/DataGridPremium parsed:^{${\tiny{\color{green}▼}}$}-256B^(-0.05%) gzip:^{${\tiny{\color{red}▲}}$}+101B^(+0.07%)
@mui/x-data-grid/DataGrid parsed:^{${\tiny{\color{green}▼}}$}-202B^(-0.06%) gzip:^{${\tiny{\color{red}▲}}$}+124B^(+0.12%)
@mui/x-data-grid parsed:^{${\tiny{\color{green}▼}}$}-197B^(-0.05%) gzip:^{${\tiny{\color{red}▲}}$}+102B^(+0.09%)

Show 2 more bundle changes

@mui/x-data-grid-pro/DataGridPro parsed:^{${\tiny{\color{green}▼}}$}-210B^(-0.05%) gzip:^{${\tiny{\color{red}▲}}$}+92B^(+0.07%)
@mui/x-data-grid-premium parsed:^{${\tiny{\color{green}▼}}$}-208B^(-0.04%) gzip:^{${\tiny{\color{red}▲}}$}+97B^(+0.06%)

Details of bundle changes

Generated by 🚫 dangerJS against da80dde

romgrk · 2025-06-04T23:23:46Z

packages/x-data-grid/src/hooks/features/virtualization/gridVirtualizationSelectors.ts

-  (apiRef: RefObject<GridApiCommunity>) =>
-    apiRef.current.state.virtualization.renderContext.firstColumnIndex,
-  (apiRef: RefObject<GridApiCommunity>) =>
-    apiRef.current.state.virtualization.renderContext.lastColumnIndex,


The create selector functions only accept state selectors, not apiRef selectors, but these aren't public so I think this is fine.

This is a consequence of removing weakMapMemoize and using unwrapIfNeeded, right?

Yes, every selector passed into createSelector(Memoized) now needs to handle that the first param is apiRefOrState. Only these two inline selectors weren't doing it.

romgrk · 2025-06-04T23:30:26Z

packages/x-data-grid/src/utils/weakMapMemoize.ts

I removed this in favor of the unwrapIfNeeded logic.

romgrk · 2025-06-04T23:33:49Z

packages/x-data-grid/src/utils/baseCreateSelector.ts

The base-ui selectors support multiple arguments (very efficiently), but we can't because our useGridSelector(api, selector, args?, equals?) wrapper has the equals argument blocking more arguments. We should rework that API at v9, we do need multiple arguments at some places and we use inefficient param objects instead. We could add useGridSelectorV9, and an alternative useGridSelectorWithEquals(api, selector, equals, ...args) for the limited cases where we need equals.

Added to #17846

docs/pages/x/api/data-grid/selectors.json

cherniavskii

I didn't quite get where the performance-related changes are. Could you clarify this?

packages/x-data-grid/src/hooks/utils/useGridSelector.ts

cherniavskii · 2025-06-05T20:57:50Z

packages/x-data-grid/src/utils/baseCreateSelector.ts

Added to #17846

cherniavskii · 2025-06-05T20:58:04Z

packages/x-data-grid/src/utils/weakMapMemoize.ts

Why don't we use it anymore?

#18234 (comment)

packages/x-internals/package.json

romgrk · 2025-06-05T22:14:35Z

I didn't quite get where the performance-related changes are. Could you clarify this?

The old implementation calls reselect's createSelector every time the selector args change.

romgrk · 2025-06-05T22:22:10Z

I didn't quite get where the performance-related changes are. Could you clarify this?

Also, the previous implementation had two map.get(...) calls for each selector call, whereas this one has a single one. The cache has been inlined inside createSelectorMemoized, so each selector instance has its own cache instead of having to reach for a global one.

github-actions · 2025-06-06T11:05:12Z

This pull request has conflicts, please resolve those before we can evaluate the pull request.

github-actions · 2025-06-09T19:09:11Z

This pull request has conflicts, please resolve those before we can evaluate the pull request.

httpete-broadcom · 2025-06-17T17:52:44Z

I found major changes in the way the grid selectors worked from V7 to V8. Specifically:

import {
  gridPageCountSelector,
  gridPageSelector,
  gridPageSizeSelector,
  useGridApiContext,
} from '@mui/x-data-grid-pro';

These selectors fired in strange ways (multiple firing, resetting the page to 0) when not using the new datasource. I had to work around them to get this upgrade in. In V7 I could switch from the out of the box pagination, or my custom one, based on the state returned by those selectors with zero issue. In V8, even the out of the box one didnt work (with server side pagination, sorting and filtering).

I just tried 8.5.2, and the pagination doesn't work at all with a purely server side grid , and still fails.

romgrk · 2025-06-17T17:57:08Z

Is it related to the changes in this PR specifically? Can you open a new issue with a reproducible example?

httpete-broadcom · 2025-06-17T18:48:03Z

It is not related to this change - I hoped that it was fixed by it. I will work on a case.

romgrk added performance scope: data grid Changes related to the data grid. type: enhancement It’s an improvement, but we can’t make up our mind whether it's a bug fix or a new feature. labels Jun 4, 2025

romgrk commented Jun 4, 2025

View reviewed changes

romgrk requested review from MBilalShafi and cherniavskii June 4, 2025 23:34

romgrk commented Jun 4, 2025

View reviewed changes

docs/pages/x/api/data-grid/selectors.json Show resolved Hide resolved

arminmeh reviewed Jun 5, 2025

View reviewed changes

docs/pages/x/api/data-grid/selectors.json Show resolved Hide resolved

cherniavskii mentioned this pull request Jun 5, 2025

[discussion] Preparing v9 #17846

Open

cherniavskii reviewed Jun 5, 2025

View reviewed changes

oliviertassinari changed the title ~~[datagrid] Performance: selectors~~ [data grid] Performance: selectors Jun 5, 2025

github-actions bot added the PR: out-of-date The pull request has merge conflicts and can't be merged. label Jun 6, 2025

github-actions bot removed the PR: out-of-date The pull request has merge conflicts and can't be merged. label Jun 6, 2025

romgrk force-pushed the refactor-selectors branch from f8a512a to 8d62906 Compare June 6, 2025 23:40

refactor+fix: weird build issue

8e6196b

romgrk force-pushed the refactor-selectors branch from 8d62906 to 8e6196b Compare June 7, 2025 00:11

romgrk added 3 commits June 6, 2025 20:18

refactor: move reselect to x-internals

4c6b280

refactor: move to x-internals

9a45c4f

refactor: move Store to x-internals

4e9b011

cherniavskii approved these changes Jun 9, 2025

View reviewed changes

lint

a547975

github-actions bot added the PR: out-of-date The pull request has merge conflicts and can't be merged. label Jun 9, 2025

Merge branch 'master' into refactor-selectors

4663b60

github-actions bot removed the PR: out-of-date The pull request has merge conflicts and can't be merged. label Jun 9, 2025

ci: run (empty commit)

da80dde

romgrk merged commit 5be7fc1 into mui:master Jun 9, 2025
22 checks passed

romgrk deleted the refactor-selectors branch June 9, 2025 20:16

MBilalShafi mentioned this pull request Jun 25, 2025

[data grid] Maximum Call Stack Size exceeded for createSelectorMemoized #11483

Closed

1 task

Uh oh!

Uh oh!

[data grid] Performance: selectors #18234

[data grid] Performance: selectors #18234

Uh oh!

Conversation

romgrk commented Jun 4, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

mui-bot commented Jun 4, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Bundle size report

Uh oh!

romgrk Jun 4, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

cherniavskii left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

romgrk commented Jun 5, 2025

Uh oh!

romgrk commented Jun 5, 2025

Uh oh!

github-actions bot commented Jun 6, 2025

Uh oh!

github-actions bot commented Jun 9, 2025

Uh oh!

Uh oh!

httpete-broadcom commented Jun 17, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

romgrk commented Jun 17, 2025

Uh oh!

httpete-broadcom commented Jun 17, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

mui-bot commented Jun 4, 2025 •

edited

Loading

romgrk Jun 4, 2025 •

edited

Loading

httpete-broadcom commented Jun 17, 2025 •

edited

Loading