Performance

Over-memoização

useMemo em primitivos é puro desperdício — strings, numbers e booleans já são comparados por valor.

Definição

Over-memoização é o uso excessivo de useMemo/useCallback/React.memo em casos onde o custo da memoização supera o benefício. Cada memoização tem custo de comparação e armazenamento — usar onde não há ganho real piora a performance.

Problema → Solução

Problema

Usar useMemo em valores que o React já compara nativamente adiciona custo sem nenhum benefício.

Solução

Memoizar apenas objetos, arrays e cálculos genuinamente custosos.

Dica de entrevista

Tip

Regra: primitivo estável? Sem memo. Objeto/array/cálculo > ~5ms? Memo vale.

Código

// ❌ Over-memoização inútil
const nome = useMemo(() => "Felipe", []);
const ativo = useMemo(() => true, []);

// ✅ Memo que justifica
const listaFiltrada = useMemo(
  () => items.filter(i => i.active).sort(...),
  [items]
);

Perguntas de entrevista

Q.Quando useCallback é desnecessário?▾

A.Quando a função não é passada como prop para componentes memoizados, nem é dependência de outro hook. Em handlers locais (onClick), useCallback é puro overhead.

Q.O React Forget vai resolver isso?▾

A.Sim. React Compiler (ex-React Forget) memoiza automaticamente componentes e hooks em compile-time. Quando estável, useMemo/useCallback manuais se tornarão raros.

Q.Como medir se memo está ajudando?▾

A.React DevTools Profiler. Compare 'tempo de render' antes e depois. Se as props nunca mudam de valor mas mudam de referência, memo ajuda. Se mudam sempre, memo só adiciona custo.

Termos relacionados

6/122← →