Questão de Programação — Programação de front end — FGV 2025
Programação›Programação de front end
Código
fg107894
Banca
FGV
Órgão
CPRM
Ano
2025
Nível
Superior
Cargo
Analista em Geociências - Geoprocessamento
Durante o desenvolvimento de um dashboard complexo em React, percebe-se que a renderização de múltiplos componentes está sendo afetada por re-renderizações desnecessárias. O operador decide aplicar React.memo combinado com useCallback em alguns componentes.A alternativa que melhor explica a razão técnica para essa escolha é que o
AReact.memo impede a propagação de props, tornando o componente completamente estático.
BuseCallback previne a criação de novas referências de função, otimizando a comparação superficial do React.memo.
CReact.memo força renderizações profundas com reconciliação de todos os filhos do componente.
DuseCallback serializa funções para evitar vazamento de memória no ciclo de vida dos hooks.
EReact.memo e useCallback são usados apenas em componentes de classe.
Revelar gabarito e comentário▾
GabaritoB — useCallback previne a criação de novas referências de função, otimizando a comparação superficial do React.memo.
Comentário gerado por IA. É um apoio ao estudo, ancorado em fontes, mas pode conter imprecisões — confira sempre na fonte oficial (lei, súmula, edital e gabarito da banca). Encontrou um erro? Use “Reportar”.
React.memo e useCallback em React
Gabarito: letra B. O uso combinado de React.memo com useCallback visa evitar re-renderizações desnecessárias: React.memo faz uma comparação superficial das props, e useCallback garante que funções callback mantenham a mesma referência entre renders, evitando que a comparação superficial aponte mudanças inexistentes.
A questão exige compreender o funcionamento de dois mecanismos de otimização do React. React.memo é um higher-order component que memoriza o componente funcional: ele só re-renderiza se alguma prop mudar (comparação rasa por padrão). Já useCallback retorna uma versão memorizada de uma função, que só é recriada quando suas dependências mudam. Essa combinação é essencial porque, sem useCallback, uma função definida dentro do componente seria recriada a cada render, fazendo com que React.memo sempre detectasse uma nova referência de prop e, portanto, não evitasse a re-renderização.
Otimização React
1React.memo
Memoriza componente funcional
Só re-renderiza se props mudarem
Comparação superficial (shallow)
2useCallback
Memoriza referência da função
Só recria se dependências mudarem
Evita nova referência a cada render
3Combinação
useCallback mantém referência estável
React.memo detecta props inalteradas
Evita re-renderizações desnecessárias
LEVEL · soulevel.com.br
Alternativa A — ❌ Incorreta
React.memo não impede a propagação de props, e muito menos torna o componente estático. Ele apenas evita re-renderizações quando as props não se alteram; as props continuam sendo passadas e o componente pode renderizar novamente se houver mudança de estado ou contexto interno.
Alternativa B — ✅ Correta ⟵ GABARITO
useCallback previne a criação de novas referências de função, o que otimiza a comparação superficial realizada por React.memo. Sem ele, funções inline criadas a cada render gerariam novas referências, fazendo com que React.memo considerasse a prop alterada e re-renderizasse o componente desnecessariamente.
Alternativa C — ❌ Incorreta
React.memo não força renderizações profundas; pelo contrário, ele evita renderizações ao fazer uma comparação superficial das props. A reconciliação de filhos continua ocorrendo normalmente apenas quando o próprio componente é renderizado.
Alternativa D — ❌ Incorreta
useCallback não serializa funções. Ele memoriza a referência da função, mas não evita vazamento de memória — aliás, uso inadequado de useCallback pode até contribuir para retenção de memória. O propósito principal é otimização de performance, não gerenciamento de memória.
Alternativa E — ❌ Incorreta
React.memo e useCallback são usados em componentes funcionais. Em componentes de classe, as alternativas são PureComponent e shouldComponentUpdate para memorização, e this binding para evitar recriação de funções.