{"id":40845,"date":"2023-10-24T10:37:43","date_gmt":"2023-10-24T13:37:43","guid":{"rendered":"\/tutoriais\/?p=40845"},"modified":"2025-12-18T11:40:17","modified_gmt":"2025-12-18T14:40:17","slug":"interaction-to-next-paint","status":"publish","type":"post","link":"\/br\/tutoriais\/interaction-to-next-paint\/","title":{"rendered":"Interaction to Next Paint (INP): entenda a nova m\u00e9trica das Core Web Vitals e como otimiz\u00e1-la"},"content":{"rendered":"

A Interaction to Next Paint (INP) é uma das novas métricas de desempenho que o Google incluirá em breve ao relatório Core Web Vitals. A função dela é medir a capacidade de resposta das páginas de um site.<\/p>

Por isso, se o seu objetivo é melhorar a posição do seu site nas páginas de resultado de pesquisa, é fundamental entender desde já o que é a INP e saber como otimizá-la. Caso contrário, o ranqueamento das suas páginas pode ser prejudicado quando essa atualização das Core Web Vitals se tornar oficial.<\/p>

Este tutorial vai analisar a Interaction to Next Paint em detalhes — incluindo como ela se diferencia de outras métricas das Core Web Vitals e como você pode medir a INP do seu site para melhorar seu desempenho atual.<\/p>

\"\"<\/a><\/figure>

\n\n\n\n\n\n\n<\/p>

<\/p>

\n\n\n

\n \n \n <\/svg>\n

\n O que é Interaction to Next Paint (INP)?\n <\/p>\n <\/div>\n

A Interaction to Next Paint (INP) é uma métrica que será adicionada em breve aos relatórios das Core Web Vitals do Google, com o objetivo de medir o tempo de resposta das páginas de um site. A INP vai mostrar a velocidade com que a página se atualiza quando o visitante interage com ela — por exemplo, quando o visitante clica em um link ou em um botão.<\/p><\/div>\n\n\n\n<\/p>

Como a Interaction to Next Paint (INP) Funciona?<\/strong><\/h2>

Como ela é uma métrica sobre a responsividade do site, a INP mede atrasos no tempo de resposta da página. Mais especificamente, ela mede a rapidez com que um elemento da página será atualizado de acordo com a ação realizada pelo visitante.<\/p>

Na prática, a INP funciona assim:<\/p>

\"Infográfico<\/figure>
    \n
  1. O visitante interage com a página de um site — clicando em um botão, por exemplo.<\/li>\n\n\n\n
  2. O navegador do visitante envia uma solicitação ao servidor, pedindo que o novo conteúdo seja carregado.<\/li>\n\n\n\n
  3. O servidor envia o novo conteúdo para o navegador do visitante.<\/li>\n\n\n\n
  4. O navegador faz a renderização do novo conteúdo na página.<\/li>\n\n\n\n
  5. O navegador mede quanto tempo demorou para renderizar o novo conteúdo, e esse dado é mostrado ao dono do site como a pontuação de INP.<\/li>\n<\/ol>

    Quando a pontuação de INP é baixa, isso significa que o navegador levou pouco tempo para renderizar o conteúdo e que a página é altamente responsiva à interação dos visitantes.<\/p>

    Como parte das Core Web Vitals<\/strong><\/a>, a INP é importante pelas seguintes razões:<\/p>