Acompanhe uma interação real
O INP considera as interações durante uma visita à página e informa a interação que melhor representa o pior desempenho de responsividade. O atraso pode vir do tratamento da entrada, de tarefas longas em JavaScript, de trabalho síncrono de layout ou de uma atualização visual atrasada por outro trabalho. Um clique que acaba funcionando ainda pode parecer pouco responsivo.
Como inspecionar
Use dados de campo para localizar grupos de páginas afetados e, depois, grave um registro de desempenho enquanto repete um toque, clique ou ação de teclado realista. Divida a interação em atraso de entrada, tempo de processamento e atraso de apresentação. Teste a rota com um perfil de dispositivo com recursos limitados; um registro feito no desktop pode esconder a pressão na thread principal.
Como implementar ou melhorar
Remova trabalho síncrono desnecessário do manipulador do evento, divida tarefas longas, evite recálculos de layout repetidos e mostre o próximo estado relevante com rapidez. Confirme que a interação continua sendo concluída, que permanece acessível pelo teclado e que não desloca a página. Compare registros de desempenho equivalentes antes e depois da mudança.
Limites e erros comuns
Não otimize apenas o primeiro clique nem substitua o trabalho da interação por um spinner superficial. A página precisa, de fato, reconhecer e concluir a tarefa do usuário.
Faça a triagem de um problema de INP dividindo a interação em atraso de entrada, tempo de processamento e atraso de apresentação. Registre o clique, toque ou ação de teclado exato, o elemento envolvido e o perfil de dispositivo. Uma tarefa longa antes do manipulador do evento sugere disputa na thread principal; um manipulador lento pode estar fazendo cálculo síncrono; uma atualização visual atrasada pode indicar trabalho de estilo ou de layout depois do manipulador. Por exemplo, um clique em filtro que reconstrói sincronamente uma lista grande pode melhorar ao reduzir o escopo da atualização e adiar trabalho não essencial, liberando a thread principal entre as etapas, mas o resultado ainda precisa indicar o progresso e continuar operável pelo teclado. Reproduza a mesma interação depois da mudança e inspecione tanto o registro de desempenho quanto a resposta visível.