🔧
Performance

Web Workers no React

Workers processam código pesado em thread separada sem travar a UI. Comunicação via postMessage + setState.

Definição

Web Workers permitem rodar JavaScript em threads separadas do main thread. Não têm acesso ao DOM. Ideais para cálculos pesados (parsing, encriptação, image processing). Comunicação via postMessage/onmessage.

🔴 Problema

Cálculos pesados no thread principal travam a UI — scroll, animações e inputs ficam sem resposta.

Solução

Criar Worker no useEffect (uma vez). Enviar via postMessage. Receber resultado e aplicar via setState.

💡 Dica Senior

Nunca criar Worker dentro do render ou de useMemo — cria nova thread a cada render. Sempre useEffect + useRef.

Perguntas de Entrevista

19/48