resumeAndPrerenderToNodeStream
resumeAndPrerenderToNodeStream continues a prerendered React tree to a static HTML string using a a Node.js Stream..
const {prelude, postponed} = await resumeAndPrerenderToNodeStream(reactNode, postponedState, options?)
Reference
resumeAndPrerenderToNodeStream(reactNode, postponedState, options?)
Call resumeAndPrerenderToNodeStream to continue a prerendered React tree to a static HTML string.
import { resumeAndPrerenderToNodeStream } from 'react-dom/static'; import { getPostponedState } from 'storage'; async function handler(request, writable) { const postponedState = getPostponedState(request); const { prelude } = await resumeAndPrerenderToNodeStream(<App />, JSON.parse(postponedState)); prelude.pipe(writable); }
On the client, call hydrateRoot to make the server-generated HTML interactive.
Parameters
reactNode: The React node you calledprerender(or a previousresumeAndPrerenderToNodeStream) with. For example, a JSX element like<App />. It is expected to represent the entire document, so theAppcomponent should render the<html>tag.postponedState: The opaquepostponeobject returned from a prerender API, loaded from wherever you stored it (e.g. redis, a file, or S3).- optional
options: An object with streaming options.- optional
signal: An abort signal that lets you abort server rendering and render the rest on the client. - optional
onError: A callback that fires whenever there is a server error, whether recoverable or not. By default, this only callsconsole.error. If you override it to log crash reports, make sure that you still callconsole.error.
- optional
Returns
resumeAndPrerenderToNodeStream returns a Promise:
- If rendering is successful, the Promise will resolve to an object containing:
prelude: a Web Stream of HTML. You can use this stream to send a response in chunks, or you can read the entire stream into a string.postponed: an JSON-serializeable, opaque object that can be passed toresumeToNodeStreamorresumeAndPrerenderToNodeStreamifresumeAndPrerenderToNodeStreamis aborted.
- If rendering fails, the Promise will be rejected. Use this to output a fallback shell.
Caveats
nonce is not an available option when prerendering. Nonces must be unique per request and if you use nonces to secure your application with CSP it would be inappropriate and insecure to include the nonce value in the prerender itself.
Usage
Further reading
resumeAndPrerenderToNodeStream behaves similarly to prerender but can be used to continue a previously started prerendering process that was aborted.
For more information about resuming a prerendered tree, see the resume documentation.