mui
[docs-infra] Fix page load speed
The problem
The page transition speed between pages is about x3-x4 too slow.
Open https://mui.com/material-ui/react-button/ and navigate to the Button Group page. It takes about 200ms to perform the transition:
According to https://web.dev/articles/inp, this is very borderline for my high-end MacBook Pro. Google Search will use a new performance ranking metric, which we don't do well:
https://search.google.com/search-console/core-web-vitals/summary?resource_id=sc-domain%3Amui.com&device=2#inp-table
The goal
Compare the experience to https://www.radix-ui.com/primitives/docs/components/alert-dialog to move to the Accordion page:
It's x2-3 better.
Same on https://ui.shadcn.com/docs/components/button, it's at about 65ms.
So as a developer, my first impression is: Material UI docs feels slow, then surely MUI System is not performant, I'm not using it, I want me end-users to have a great UX. To be fair, we can't really compare Material UI docs page to others, we have a lot more content on the page.
It is to be noted that it seems a regression, https://v4.mui.com/components/button-group/ is faster:
Part of the solutions
- Layout. We don't use layouts like the comparison I raised about. https://github.com/mui/material-ui/pull/38394 showcases the benefits of using a layout using the Next.js Pages Router. It helps a good amount. Same in https://github.com/mui/material-ui/pull/38050#discussion_r1268280912, https://github.com/mui/material-ui/pull/36732.
- Emotion. It's slow, we spend a lot of time doing style computations
- ?
Context
This issue is meant to be closed with insights gathered after the research task
Search keywords: docs-infra, page load
