[data grid] Updating rows has a performance bottleneck (MissingRowIdError + try/catch)

[lauri865]

Steps to reproduce

Steps:

1. Open this link to live example
2. Start performance measurements
3. Click on "Replace rows" either just once or better yet 10 times in a fast sequence

My result – 25% of all scripting time is spent on try/catch handling:

Current behavior

Cells and rows lose their state when rows are updated, but while the olds rows are still mounted.

Expected behavior

Ideally rows and cells should retain their state even through the whole rendering cycle.
However, I completely understand if that's difficult to fix.

The good enough alternative is to avoid throwing any errors and return null instead. Try/Catch logic has too much overhead in these hot code paths.

Context

We use setRows extensively, since we handle filtering outside of the Datagrid component. Setting rows on each keystroke when searching could benefit from an improved performance.

For fast changing grids, it would also reduce the need for row update throttling quite a bit.

Your environment

npx @mui/envinfo

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

Search keywords: MissingRowIdError

[michelengelen]

Thanks @lauri865 for opening an issue for this. I will add it to the board for the team to have a look. If you have an idea how this could be improved feel free to open a PR yourself though. 👍🏼

[lauri865]

I already opened a PR ;) #15616

[github-actions]

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue.
Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

Note

@lauri865 How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.