O que é useMemo?
Definição
Hook do React que memoiza o resultado de uma computação cara, recalculando apenas quando suas dependências mudam. Evita reprocessamentos desnecessários a cada render.
Ideal para transformações de dados pesadas ou valores derivados de estado. Não substitui useCallback, que memoiza funções.
Exemplo Prático
TypeScript
const filteredUsers = useMemo(() => {
return users.filter(u => u.active && u.role === selectedRole);
}, [users, selectedRole]);
const total = useMemo(() => {
return orders.reduce((acc, o) => acc + o.value, 0);
}, [orders]);Quer ver useMemo em ação em projetos reais?
Ver artigos sobre useMemo