Pergunta de entrevista para Desenvolvedor Frontend

Quais Core Web Vitals você otimiza, e o que o Interaction to Next Paint realmente mede?

O que o entrevistador está avaliando, como estruturar sua resposta e um exemplo falado que você pode adaptar.

Resposta rápida

As três são Largest Contentful Paint para carregamento, Interaction to Next Paint para responsividade e Cumulative Layout Shift para estabilidade visual. INP mede a latência completa de uma interação, do evento de entrada passando pelo seu handler e por qualquer trabalho de renderização, até o próximo frame ser pintado. O Google reporta aproximadamente a pior interação da página, então um único handler lento arruína a nota mesmo que a média esteja boa.

Por que os entrevistadores perguntam isso

INP substituiu o First Input Delay, então isso checa se seu conhecimento está atual em vez de três anos defasado. O entrevistador quer ouvir que ele inclui o seu event handler e a renderização resultante, e não só o atraso antes de o handler começar, porque isso muda como você corrige. Saber os limiares e que a métrica vem de dados reais de usuários em vez de uma rodada de laboratório separa quem já entregou trabalho de performance de quem só leu o post.

Como estruturar sua resposta

  • Nomeie as três métricas e o que cada uma cobre.
  • Quebre o INP em input delay, tempo de processamento e presentation delay.
  • Diga qual é o limiar bom e que ele vem de dados de campo.
  • Diga o que você de fato muda para corrigir uma nota ruim.

Exemplo de resposta

Exemplo falado, em primeira pessoa

As três são LCP para quão rápido o conteúdo principal aparece, INP para responsividade e CLS para estabilidade de layout. INP é a interessante porque substituiu o First Input Delay, e mede a interação inteira em vez de só a espera antes de o handler rodar. Então é o input delay enquanto a main thread está ocupada, mais quanto tempo meu handler leva, mais o presentation delay para renderizar o próximo frame. Abaixo de duzentos milissegundos é o balde bom, e é medido em usuários reais em campo, então reflete celulares Android intermediários, não o meu notebook. A consequência prática é que corrigir isso normalmente significa corrigir o handler, não o bundle. Numa página de busca que eu mantinha, a digitação reportava uns quatrocentos milissegundos, e descobri que cada tecla re renderizava de forma síncrona uma lista grande de resultados. Aplicar debounce na parte cara e devolver o controle ao navegador antes da renderização derrubou para menos de cento e cinquenta.

Vai encarar essa entrevista em breve? O GhostPilot escuta a sua chamada ao vivo, identifica a pergunta no instante em que ela é feita e coloca uma resposta estruturada na sua tela em tempo real. Teste na sua próxima entrevista simulada ou pegue um Session Pass de $29, sem assinatura, para a hora da verdade.

Veja como funciona

Perguntas de acompanhamento que você pode esperar

  • Como você descobriria qual interação está puxando um INP ruim em campo?
  • Por que ferramentas de laboratório podem mostrar um bom resultado quando usuários reais veem um ruim?
  • O que causa um presentation delay alto especificamente?

Mais perguntas para Desenvolvedor Frontend

Seu entrevistador vai fazer a própria versão desta. Cole a descrição real da vaga no Question Predictor gratuito e receba as 20 perguntas que essa vaga tem mais chance de fazer, com o que cada uma está de fato sondando.

Prever minhas perguntas

Ensaie as perguntas difíceis antes que elas apareçam

Pratique com um copiloto ao vivo e depois entre pronto. Um Session Pass de $29 te leva até o fim da entrevista, sem assinatura e sem amarras.

Instalar o GhostPilot