search

mui / mui-x

MUI X: Build complex and data-rich applications using a growing list of advanced React components, like the Data Grid, Date and Time Pickers, Charts, and more!
https://mui.com/x/
4.07k stars 1.26k forks source link

[tree view] Performance issue #14634

Open oliviertassinari opened 4 days ago

oliviertassinari commented 4 days ago

Steps to reproduce

Steps:

  1. Open https://mui.com/material-ui/customization/default-theme/?expand-path=$.palette
  2. Open one of the tree item

https://github.com/user-attachments/assets/83b86db1-73ca-4f23-8b6d-28ff05b52891

Current behavior

It takes 200ms to respond, on a high-end laptop

Expected behavior

It takes 20ms to respond, on a high-end laptop

Context

I have noticed this from: https://pagespeed.web.dev/analysis/https-mui-com-material-ui-customization-default-theme/af76fe8h6e?form_factor=desktop. The field data says the page is too slow:

SCR-20240915-dqlk

It was so much faster in https://v5-0-6.mui.com/customization/default-theme/ before we moved to use the tree view.

We could potentially use React.useDeferredValue like in https://github.com/mui/material-ui/pull/43569 for the checkbox lag but it won't solve the root problem.

SCR-20240915-drjz

To be noted that #9685 might be needed to solve the switch all case, but for expanding a node of 5 items like in my screen recording, it can't be the solution.

Your environment

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

Search keywords: -

flaviendelangle commented 2 days ago

I have 2 main ongoing topic for performances:

And then we have regular optimization, some code might be badly designed right now. But I expect the selectors to be a good milestone, re-rendering only the Tree View + a handful of items when toggling the expansion of one item should help a lot compared to today.