Programação · FUNDATEC · 2025 | Questão sqc-qg474995

ProgramaçãoFrameworks em Programação

Código: qg474995
Banca: FUNDATEC
Órgão: PROCERGS
Ano: 2025
Nível: Superior

Cargo: Analista em Computação/Ênfase em Programação de Sistemas na Tecnologia Microsoft

Um sistema web em React usa roteamento no cliente (sem recarregamento completo). Na revisão de desempenho, observou-se que as transições entre páginas parecem "congelar" quando o usuário navega para áreas pouco usadas da aplicação. Considerando as características de uma Single Page Application (SPA), qual abordagem tende a melhorar a fluidez da experiência sem abandonar o modelo SPA?

ATrocar o roteamento no cliente por links convencionais com recarregamento completo para aproveitar o cache do navegador em cada navegação.
BImplementar carregamento sob demanda dos componentes de rota, dividindo o bundle para baixar apenas o código necessário a cada página.
CAtivar StrictMode do React para que o framework otimize renderizações e evite travamentos nas transições.
DIntroduzir manipulação direta da DOM com jQuery para "bypassar" o reconciliation do React reduzir o uso de hooks.
EConverter a aplicação de SPA para MPA (várias páginas com recarregamento completo) para reduzir o bundle inicial e, assim, acelerar as transições.

Revelar gabarito e comentário

GabaritoB — Implementar carregamento sob demanda dos componentes de rota, dividindo o bundle para baixar apenas o código necessário a cada página.

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”.

Otimização de desempenho em React com SPA

Gabarito: letra B. O problema descrito é característico de bundles grandes que carregam todo o código de uma vez, causando congelamento ao acessar rotas pouco usadas. A abordagem que resolve isso sem abandonar o modelo SPA é o carregamento sob demanda (lazy loading) dos componentes de rota, que divide o bundle e baixa apenas o código necessário para cada página, melhorando a fluidez.

Análise das alternativas

Alternativa A — ❌ Incorreta

Trocar o roteamento no cliente por links convencionais com recarregamento completo abandona o modelo SPA, transformando a aplicação em uma MPA (Multi Page Application). A banca pede uma solução que não abandone o SPA; portanto, essa alternativa está errada.

Alternativa B — ✅ Correta ⟵ GABARITO

Implementar carregamento sob demanda dos componentes de rota (lazy loading) é uma prática recomendada em React. Ela utiliza React.lazy() e Suspense para carregar os módulos de cada rota apenas quando forem acessados, reduzindo o tamanho do bundle inicial e evitando o congelamento em transições para áreas pouco usadas.

Alternativa C — ❌ Incorreta

O StrictMode do React é uma ferramenta de desenvolvimento que ajuda a detectar problemas potenciais (como efeitos colaterais e uso de métodos depreciados), não otimiza renderizações nem evita travamentos em transições. Ele não melhora a fluidez no sentido de carregamento de código.

Alternativa D — ❌ Incorreta

Introduzir manipulação direta da DOM com jQuery para "bypassar" o reconciliation do React vai contra o paradigma declarativo do framework. Isso pode causar inconsistências no estado da UI e não é uma abordagem recomendada para melhorar desempenho. O React já otimiza as atualizações da DOM virtual; a solução correta é o lazy loading.

Alternativa E — ❌ Incorreta

Converter a aplicação de SPA para MPA (com recarregamento completo entre páginas) abandona o modelo SPA proposto no enunciado. Embora possa reduzir o bundle inicial, a experiência de navegação será diferente (recarregamentos completos), o que não atende ao requisito de “não abandonar o modelo SPA”.

PEGA ESSA DICA!

Em React, o lazy loading de rotas é implementado com React.lazy() e Suspense, geralmente combinado com o roteador (React Router). Essa técnica é essencial para aplicações SPA grandes e é frequentemente cobrada em questões de desempenho.

Gabarito: letra B — carregamento sob demanda (lazy loading) dos componentes de rota.

Link permanente: /questoes/qg474995