Sobre a Interação com a Próxima Pintura
O que é a Interação com a Próxima Pintura?
Interaction to Next Paint mede quanto tempo uma página demora a responder visualmente quando alguém interage com ela — através de um toque, clique ou pressão de uma tecla. Mede o período desde o momento da interação até ao momento em que o ecrã é atualizado novamente.
O que capta é a sensação de uma página que não responde: o menu que não abre, o botão que é premido duas vezes porque nada aconteceu da primeira vez. Esse atraso deve-se quase sempre ao facto de a thread principal estar ocupada com outra tarefa.
Tornou-se um Core Web Vital em março de 2024, substituindo o First Input Delay. A mudança foi importante porque a métrica antiga media apenas o atraso antes de o processamento da primeira interação começar, favorecendo páginas que respondiam prontamente uma vez e depois ficavam lentas.
O que é considerado um bom INP?
O Google considera 200 milissegundos ou menos como bom, entre 200 e 500 milissegundos como a precisar de melhorias, e qualquer valor acima de 500 milissegundos como fraco, novamente no percentil 75 das interações reais.
Ao contrário do LCP, esta não é uma medição por carregamento de página. Um visitante interage várias vezes durante uma sessão, e o INP regista um valor próximo do pior desses momentos. Assim, uma página é avaliada pelo seu momento mais lento, e não pelo seu desempenho habitual.
Isto torna-o o mais difícil de manipular dos três. É possível fazer com que uma página carregue rapidamente num teste; manter a capacidade de resposta durante uma sessão completa é uma característica da forma como foi construída.
O que costuma causar um INP fraco
Os problemas de INP são quase sempre problemas de JavaScript e, mais especificamente, tarefas longas que bloqueiam a thread principal quando o visitante está a tentar utilizar a página.
- Manipuladores de eventos pesados a executar o seu trabalho de forma síncrona antes de cederem o controlo.
- Scripts grandes que continuam a ser analisados e executados enquanto a página parece estar pronta.
- Etiquetas de terceiros — widgets de chat, ferramentas de análise, testes A/B, scripts de publicidade — a competir pela mesma thread.
- Trabalho de layout dispendioso desencadeado por uma interação, como voltar a renderizar uma lista longa.
- As frameworks a voltar a renderizar uma parte maior da página do que aquela que a interação efetivamente alterou.
Os terceiros merecem uma atenção especial, porque são a parte da página que ninguém controla e que se altera sem que ninguém faça qualquer implementação.
Como melhorar
- Divida as tarefas longas e ceda o controlo ao navegador para que possa atualizar o ecrã entre elas.
- Mostre primeiro o resultado visível de uma interação e, em seguida, execute o trabalho restante.
- Adie tudo o que não seja necessário para a primeira interação, especialmente os scripts de terceiros.
- Audite o gestor de etiquetas. A maioria dos sites contém etiquetas de que ninguém precisa há anos.
- Evite voltar a renderizar secções inteiras quando apenas um elemento foi alterado.
- Teste num telemóvel de gama média, onde é muito mais fácil saturar a thread do que num portátil.
O que esta ferramenta verifica
O teste de INP lê os dados de campo da Google relativos à página — medições recolhidas de visitantes reais no Chrome — e mostra em que posição se encontra relativamente aos limites acima.
O INP só pode ser medido quando alguém interage efetivamente, pelo que é a métrica que mais provavelmente estará indisponível numa página sem atividade ou que as pessoas simplesmente leem. Isso não é uma falha; significa que ainda não há nada para comunicar.
Próximos passos
A capacidade de resposta é um problema de scripts, por isso comece pelo que a página está a executar. Verifique os
Erros de JavaScript, veja quantos ficheiros distintos são carregados com a ferramenta
pedido de página e confirme que nada está completamente avariado com uma
auditoria do site completa.