Pular para o conteúdo
Voltar para o blog

Renderização no servidor com React Server Components

Maurício Romagnollo1 min de leitura
  • React
  • Performance
Ilustração de React Server Components

RSC muda o modelo mental: por padrão tudo roda no servidor. Você só paga o custo de JS no cliente quando realmente precisa de interatividade.

// Server Component (sem 'use client'): pode ser async
export async function CodeBlock({ code, language }: Props) {
  const html = await codeToHtml(code, { lang: language, theme: 'github-dark' })
  return <div dangerouslySetInnerHTML={{ __html: html }} />
}

O highlight acontece no build/servidor com shiki. O cliente recebe só HTML já colorido — zero JavaScript de highlight. Ótimo para Core Web Vitals.

Use o servidor por padrão. Vá para o cliente só quando precisar.