react/scripts/error-codes
Sebastian Markbåge 3ef31d196a
Implement Partial Hydration for Activity (#32863)
Stacked on #32862 and #32842.

This means that Activity boundaries now act as boundaries which can have
their effects mounted independently. Just like Suspense boundaries, we
hydrate the outer content first and then start hydrating the content in
an Offscreen lane. Flowing props or interacting with the content
increases the priority just like Suspense boundaries.

This skips emitting even the comments for `<Activity mode="hidden">` so
we don't hydrate those. Instead those are deferred to a later client
render.

The implementation are just forked copies of the SuspenseComponent
branches and then carefully going through each line and tweaking it.

The main interesting bit is that, unlike Suspense, Activity boundaries
don't have fallbacks so all those branches where you might commit a
suspended tree disappears. Instead, if something suspends while
hydration, we can just leave the dehydrated content in place. However,
if something does suspend during client rendering then it should bubble
up to the parent. Therefore, we have to be careful to only
pushSuspenseHandler when hydrating. That's really the main difference.

This just uses the existing basic Activity tests but I've started work
on port all of the applicable Suspense tests in SelectiveHydration-test
and PartialHydration-test to Activity versions.
2025-04-22 21:00:30 -04:00
..
__tests__ feat(eslint-plugin-react-hooks): merge rule from eslint-plugin-react-compiler into react-hooks plugin (#32416) 2025-03-12 21:43:06 -04:00
codes.json Implement Partial Hydration for Activity (#32863) 2025-04-22 21:00:30 -04:00
extract-errors.js Follow-up improvements to error code extraction infra (#22516) 2021-10-31 15:37:32 -07:00
invertObject.js [useFormState] Allow sync actions (#27571) 2023-10-31 23:32:31 -04:00
README.md Follow-up improvements to error code extraction infra (#22516) 2021-10-31 15:37:32 -07:00
transform-error-messages.js Track Stack of JSX Calls (#29032) 2024-05-09 12:23:05 -04:00
Types.js Upgrade prettier (#26081) 2023-01-31 08:25:05 -05:00

The error code system substitutes React's error messages with error IDs to provide a better debugging support in production. Check out the blog post here.

  • codes.json contains the mapping from IDs to error messages. This file is generated by the Gulp plugin and is used by both the Babel plugin and the error decoder page in our documentation. This file is append-only, which means an existing code in the file will never be changed/removed.
  • extract-errors.js is an node script that traverses our codebase and updates codes.json. You can test it by running yarn extract-errors. It works by crawling the build artifacts directory, so you need to have either run the build script or downloaded pre-built artifacts (e.g. with yarn download build). It works with partial builds, too.
  • transform-error-messages is a Babel pass that rewrites error messages to IDs for a production (minified) build.