docs(react-live-dynamic): reduces 32.2% size of the docs website#4451
docs(react-live-dynamic): reduces 32.2% size of the docs website#4451segunadebayo merged 7 commits intochakra-ui:mainfrom
Conversation
|
|
This pull request is being automatically deployed with Vercel (learn more). 🔍 Inspect: https://vercel.com/chakra-ui/chakra-ui/HxHBMXHFetpSNvLScnKBoSSR7EiB |
|
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. Latest deployment of this branch, based on commit ccff167:
|
with-heart
left a comment
There was a problem hiding this comment.
That's an impressive amount of improvement for how little change is required. Thanks so much!
| const ReactLiveBlock = dynamic(() => import("./react-live-block")) | ||
|
|
||
| function CodeBlock(props) { | ||
| const [isMounted, { on }] = useBoolean() |
There was a problem hiding this comment.
TIL, again! I forgot this was even a thing 🤦
| if (render) { | ||
| if (isMounted && render) { | ||
| /** | ||
| * @TODO Not sure if this is even used? |
There was a problem hiding this comment.
I don't think it is either
There was a problem hiding this comment.
Yeah I seems cannot find the source of it from the MDX docs
📝 Description
Per page size reduction: 785kB -> 532kB. Reduced 32.2% of the initial bytes.
⛳️ Current behavior (updates)
The current
<CodeBlock />importsreact-liveeverywhere. Even for those pages that are not even using the live-editor feature (live=true).🚀 New behavior
Refactor
<CodeBlock />and make the live-editor parts loadable vianext/dynamic.💣 Is this a breaking change (Yes/No):
No
📝 Additional Information
The loadable information by
Nextjs: