📖
Hook 18

useTransition

Marca setState como não-urgente. Retorna [isPending, startTransition]. Mantém UI responsiva durante updates pesados.

📚 O que é

O React pode interromper a transição não-urgente se um update urgente chegar (ex: digitação). isPending indica que uma transição está em andamento — use para mostrar feedback visual.

✅ Quando usar

Filtros pesados em listas grandes. Navegação entre tabs com conteúdo pesado. Qualquer atualização que pode demorar mas não precisa ser imediata.

🚫 Quando NÃO usar

Inputs controlados (sempre urgentes). Animações. Updates que o usuário PRECISA ver imediatamente. Chamadas de API (use debounce).

👍 Prós
UI permanece responsiva
isPending para feedback visual
Sem lib externa
Interrompível pelo React
👎 Contras
Não funciona para chamadas async de rede
Mais verboso que debounce simples
Precisa de React 18
🔗 Termos relacionados
useDeferredValue
Hook 18

Retorna versão 'atrasada' de um valor. React mantém valor anterior enquanto processa o novo.

useId
Hook 18

Gera ID único e estável entre server e client. Previne hydration mismatch.

useSyncExternalStore
Hook 18

Subscriba em stores externos sem tearing em Concurrent Mode.