O que faz o useMemo? Quando deve ser usado? É necessário envolver o componente filho em React.memo?

useMemo — é um hook no React que permite memorizar (guardar em cache) o resultado de uma função para evitar cálculos desnecessários na re-renderização do componente.

Deve usar useMemo quando tiver cálculos caros em recursos ou objetos complexos que não devem ser recriados sem necessidade.

Exemplo:

const valorMemorizado = useMemo(() => computeExpensiveValue(a, b), [a, b]);

Aqui, computeExpensiveValue será chamado apenas se a ou b mudarem.

Quanto ao React.memo — é um HOC que memoriza o próprio componente, evitando sua re-renderização se as props não mudarem.

Deve envolver o componente filho em React.memo se:

• o componente renderiza frequentemente,
• e as props não mudam,
• e a re-renderização do componente é cara.

Resumindo:

• useMemo otimiza os cálculos internos do componente,
• React.memo otimiza a renderização de componentes filhos.

Ambas as ferramentas podem ser usadas juntas para melhorar o desempenho, mas devem ser aplicadas apenas quando realmente necessário para não complicar o código.