📖
Core

Suspense

Componente que mostra fallback enquanto filhos 'suspendem' (lançam Promise não resolvida).

📚 O que é

Filhos lançam Promise quando não estão prontos. Suspense captura e renderiza fallback até resolver. Suportado nativamente em: React.lazy, RSC/Next.js, e libs com suspense:true (React Query, Relay).

✅ Quando usar

Code splitting com React.lazy. Data fetching com RSC + streaming. Loading states independentes por área da UI. Granularidade — um Suspense por área.

🚫 Quando NÃO usar

Para um único loading state global (use estado manual). Quando a lib não suporta suspense. Para erros (combine com ErrorBoundary).

👍 Prós
Loading declarativo
Granularidade de UI
Streaming SSR
Selective Hydration
👎 Contras
Requer lib compatível (não funciona com fetch em useEffect)
Sem Suspense para erros
Aninhamento pode ser confuso
🔗 Termos relacionados
JSX
Core

Sintaxe que parece HTML mas compila para React.createElement().

Virtual DOM
Core

Representação em JS da árvore do DOM real. React compara versões e aplica só as diferenças.

Reconciliation
Core

Algoritmo que compara dois Virtual DOMs e calcula o mínimo de mudanças para o DOM real.

Fiber
Core

Arquitetura interna do React 16+ que permite renderização interrompível e priorização.

Error Boundary
Core

Componente class que captura erros em filhos. Mostra UI de fallback em vez de quebrar o app.

Hydration
Core

Processo de attachar event listeners do React ao HTML pré-gerado pelo servidor.