Hydrates a server rendered RSCPayload
in the browser.
import { startTransition, StrictMode } from "react";
import { hydrateRoot } from "react-dom/client";
import {
unstable_getRSCStream as getRSCStream,
unstable_RSCHydratedRouter as RSCHydratedRouter,
} from "react-router";
import type { unstable_RSCPayload as RSCPayload } from "react-router";
createFromReadableStream(getRSCStream()).then(
(payload: RSCServerPayload) => {
startTransition(async () => {
hydrateRoot(
document,
<StrictMode>
<RSCHydratedRouter
createFromReadableStream={
createFromReadableStream
}
payload={payload}
/>
</StrictMode>,
{
formState: await getFormState(payload),
}
);
});
}
);
Your react-server-dom-xyz/client
's createFromReadableStream
function, used to decode payloads from the server.
The decoded RSCPayload
to hydrate.
eager
or lazy
- Determines if links are eagerly discovered, or delayed until clicked.
A function that returns an unstable_InitialContext
object (Map<RouterContext, unknown>
), for use in client loaders, actions and middleware.