Perguntas de entrevista para Programador Frontend

Resposta-modelo

Começo por medir com o Lighthouse e com o painel de Web Vitals, olhando para o INP, o LCP e o CLS. Depois atuo sobre as causas: divido o código com code splitting, adio o carregamento de componentes não críticos, otimizo imagens e reduzo o JavaScript no arranque. Numa aplicação recente, esta abordagem baixou o INP de 300 ms para 170 ms.

Resposta-modelo

Trabalho com HTML semântico, garanto a navegação por teclado e testo com leitores de ecrã. Sigo a WCAG 2.1 no nível AA e valido o contraste e os atributos ARIA. Em contexto europeu, tenho em conta a norma EN 301 549 e as exigências do Ato Europeu da Acessibilidade, sobretudo em projetos do setor público ou da banca.

Resposta-modelo

Mantenho no componente o estado que só a ele diz respeito, como o valor de um campo de formulário. Elevo a estado global — com o Redux Toolkit ou a Context API — apenas o que várias partes da aplicação precisam de partilhar, como a sessão do utilizador. Evito colocar tudo no estado global para não provocar re-renderizações desnecessárias.

Resposta-modelo

Recebo os protótipos em Figma e, antes de começar, alinho detalhes de espaçamento, estados interativos e comportamento responsivo. Sempre que possível, contribuo para o design system partilhado, para que as decisões visuais fiquem codificadas em componentes reutilizáveis. Esta proximidade reduz as idas e voltas e mantém a coerência do produto.

Resposta-modelo

Adoto uma estratégia mobile-first com CSS moderno — Flexbox, Grid e container queries — e testo nos principais navegadores. Uso progressive enhancement para que a experiência básica funcione em todo o lado e recorro a ferramentas como o Can I use para decidir quando aplicar fallbacks.

Resposta-modelo

Escrevo testes com Jest e Testing Library centrados no comportamento do utilizador, uso TypeScript para apanhar erros cedo e configuro linting e formatação automáticos. Em equipa, defendo revisões de código e integração contínua para que nada chegue a produção sem validação.

É o mecanismo que permite ao JavaScript, sendo de thread única, gerir operações assíncronas. A call stack executa o código síncrono e, quando fica livre, o event loop retira tarefas das filas — as microtarefas, como as Promises, antes das macrotarefas, como o setTimeout. Compreendê-lo evita bloquear a interface e ajuda a manter o ecrã fluido.

No render do lado do cliente (CSR), o navegador recebe um HTML mínimo e constrói a interface com JavaScript. No render do lado do servidor (SSR), o HTML é gerado a cada pedido, melhorando o primeiro carregamento e o SEO. Na geração estática (SSG), as páginas são criadas no momento da compilação. Frameworks como o Next.js permitem combinar as três abordagens consoante a página.

O React mantém uma representação em memória da árvore de interface. Quando o estado muda, cria uma nova versão e compara-a com a anterior, num processo de reconciliação, aplicando ao DOM real apenas as diferenças. Isto reduz manipulações dispendiosas do DOM, embora não seja automaticamente mais rápido do que atualizações manuais bem feitas.

Uma closure é uma função que retém acesso ao contexto onde foi criada, mesmo depois de esse contexto terminar. Surgem em callbacks, em hooks como o useState e o useEffect e na criação de funções de fábrica. Permitem encapsular estado privado, mas exigem cuidado para não reter referências desnecessárias em memória.

Primeiro confirmo o impacto com os dados de monitorização e reproduzo o problema. Se for grave, reverto a alteração para estabilizar a produção e só depois investigo a causa com calma, usando o profiler do navegador. Comunico o ponto de situação à equipa para que todos saibam o que está a acontecer.

Converso cedo com a designer responsável, explico as limitações técnicas e proponho alternativas que preservem a intenção do design. Procuro um compromisso, por exemplo uma entrega faseada, e documento a decisão para que fique registada.

Começo por perceber o comportamento atual e por escrever testes em torno das áreas mais críticas, para criar uma rede de segurança. Depois reestruturo o código de forma incremental, sem parar as entregas, e negoceio com a gestão do produto o tempo necessário para reduzir a dívida técnica sem comprometer prazos.