📋
Performance
Virtualização de Listas
Renderizar apenas os itens visíveis no viewport — não todos os 10.000 de uma vez no DOM.
Definição
Virtualização (windowing) é a técnica de renderizar apenas os itens visíveis de uma lista grande. Mantém uma 'janela' (window) de itens no DOM e atualiza conforme o scroll. Bibliotecas: react-window, react-virtualized, TanStack Virtual.
🔴 Problema
10.000 itens = 10.000 nós reais no DOM = browser travado no scroll e na renderização.
✅ Solução
react-window ou react-virtualized renderiza apenas ~15 itens visíveis, independente do total.
💡 Dica Senior
Para listas > 200 itens com lentidão visível: virtualização é sempre o primeiro passo.
Perguntas de Entrevista
8/48