📖
Hook

useCallback

Memoiza uma FUNÇÃO. Mantém a mesma referência entre renders enquanto deps não mudam.

📚 O que é

useCallback(fn, deps) equivale a useMemo(() => fn, deps). Útil quando você precisa passar função estável para componentes memoizados ou como dep de outro hook.

✅ Quando usar

Passar callback para componente memoizado com React.memo. Função usada como dep em useEffect. Handlers passados para listas virtualizadas.

🚫 Quando NÃO usar

Funções locais que não são passadas para baixo. Quando o componente receptor não é memoizado (não adianta nada). Componentes simples sem problemas de performance.

👍 Prós
Mantém referência estável
Evita re-renders em filhos memoizados
Correto para deps de hooks
👎 Contras
Overhead se mal usado
Cria falsa sensação de segurança
Par obrigatório com React.memo para ter efeito
🔗 Termos relacionados
useState
Hook

Hook básico para estado local do componente.

useEffect
Hook

Roda side effects após o React commitar mudanças no DOM.

useLayoutEffect
Hook

Como useEffect, mas executa síncronamente ANTES do browser pintar.

useMemo
Hook

Memoiza o RESULTADO de uma computação. Recomputa apenas quando as deps mudam.

useRef
Hook

Cria objeto { current } mutável que persiste entre renders sem causar re-render quando alterado.

useReducer
Hook

Alternativa ao useState para estado complexo com múltiplas transições.

useContext
Hook

Lê o valor do Context Provider mais próximo na árvore. Re-renderiza quando value muda.