-
-
Notifications
You must be signed in to change notification settings - Fork 1.1k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix unnecessary top-level context changes #1924
Conversation
This pull request is being automatically deployed with Vercel (learn more). 🔍 Inspect: https://vercel.com/mdx/mdx/3tvkGxFofbz2F6JK9KGgsMMkNhEi |
not sure how to fix the ts thing, do you want to do it or i'll look into it? |
would it be tough to also port this to 1.x? not sure if you release those anymore |
|
fair enough, maybe i'll just bite the bullet and try to get the v2 migration going again |
Thanks дэн! |
MDXProvider often sits at the top of the trees. The object spread here is unfortunate because it means the provider value will always be new, and so React would need to spend time propagating the context (even though nothing really changed). This also has implications on Selective Hydration in React 18: if top-level context updates before hydration is fully finished, we have to show Suspense fallbacks — which isn't a great experience when it's unnecessary. facebook/react#22692.
This change should fix it.
How to test
I typed this change on GH so you'll need to double-check but hopefully this looks good.
Locally, I tested something similar with manual editing in
node_modules
, and it worked.My actual "test case" is in reactjs/react.dev#4256. When I do this fix together with vercel/next.js#33861, HTML from code-split chunks is no longer forced to turn into a fallback. I've artificially increased the bundle load delay in this video to make the hydration noticeable. When code blocks become colored, it's hydrated:
yo.mov
Before the change, the code blocks would turn into placeholders before turning back into codeblocks.