API de Referência
Static APIs

resumeAndPrerenderToNodeStream

resumeAndPrerenderToNodeStream continua uma árvore pré-renderizada do React para uma string HTML estática usando um Node.js Stream..

const {prelude, postponed} = await resumeAndPrerenderToNodeStream(reactNode, postponedState, options?)

Note

Esta API é específica para Node.js. Ambientes com Web Streams, como Deno e runtimes de edge modernos, devem usar prerender em vez disso.

Referência

resumeAndPrerenderToNodeStream(reactNode, postponedState, options?)

Chame resumeAndPrerenderToNodeStream para continuar uma árvore pré-renderizada do React para uma string HTML estática.

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);
}

No cliente, chame hydrateRoot para tornar o HTML gerado pelo servidor interativo.

Veja mais exemplos abaixo.

Parâmetros

  • reactNode: O nó React com o qual você chamou prerender (ou um resumeAndPrerenderToNodeStream anterior). Por exemplo, um elemento JSX como <App />. Espera-se que ele represente o documento inteiro, então o componente App deve renderizar a tag <html>.
  • postponedState: O objeto postpone opaco retornado por uma API de prerender, carregado de onde quer que você o tenha armazenado (por exemplo, redis, um arquivo ou S3).
  • opcional options: Um objeto com opções de streaming.

Retorna

resumeAndPrerenderToNodeStream retorna uma Promise:

  • Se a renderização for bem-sucedida, a Promise será resolvida para um objeto contendo:
    • prelude: um Web Stream de HTML. Você pode usar este stream para enviar uma resposta em pedaços, ou pode ler o stream inteiro em uma string.
    • postponed: um objeto opaco e serializável em JSON que pode ser passado para resumeToNodeStream ou resumeAndPrerenderToNodeStream se resumeAndPrerenderToNodeStream for abortado.
  • Se a renderização falhar, a Promise será rejeitada. Use isso para gerar um shell de fallback.

Ressalvas

nonce não é uma opção disponível ao pré-renderizar. Nonces devem ser únicos por solicitação e se você usar nonces para proteger seu aplicativo com CSP seria inadequado e inseguro incluir o valor do nonce na pré-renderização em si.

Note

Quando devo usar resumeAndPrerenderToNodeStream?

A API estática resumeAndPrerenderToNodeStream é usada para geração estática do lado do servidor (SSG). Ao contrário de renderToString, resumeAndPrerenderToNodeStream espera que todos os dados sejam carregados antes de resolver. Isso o torna adequado para gerar HTML estático para uma página inteira, incluindo dados que precisam ser buscados usando Suspense. Para transmitir conteúdo à medida que ele é carregado, use uma API de renderização do lado do servidor (SSR) em streaming como renderToReadableStream.

resumeAndPrerenderToNodeStream pode ser abortado e posteriormente continuado com outro resumeAndPrerenderToNodeStream ou retomado com resume para suportar pré-renderização parcial.

Uso

Leitura adicional

resumeAndPrerenderToNodeStream se comporta de forma semelhante a prerender, mas pode ser usado para continuar um processo de pré-renderização iniciado anteriormente que foi abortado. Para mais informações sobre como retomar uma árvore pré-renderizada, veja a documentação de resume.

PreviousresumeAndPrerender