INP, Interaction to Next Paint, noul metric Core Web Vitals și cum îl optimizezi

INP, Interaction to Next Paint, a devenit metric oficial Core Web Vitals în martie 2024, înlocuind FID (First Input Delay). Dacă site-ul dvs. are un scor INP peste 200ms, Google consideră că experiența utilizatorului necesită îmbunătățire.

Spre deosebire de FID care măsura doar întârzierea primei interacțiuni, INP măsoară latența tuturor interacțiunilor din întreaga sesiune de navigare.

INP, Interaction to Next Paint, noul metric Core Web Vitals și cum îl optimizezi

Pragurile oficiale stabilite de Google sunt clare: un INP sub 200 milisecunde este considerat bun, între 200ms și 500ms necesită îmbunătățire, iar peste 500ms este considerat slab. Pragul se aplică la percentila 75 a tuturor încărcărilor de pagină.

Conform HTTP Archive Web Almanac 2025, 77% din paginile mobile au acum un INP bun. Totuși, datele arată că numai 53% din primele 1.000 de site-uri cele mai vizitate trec pragul recomandat.

Cum funcționează INP și ce măsoară exact

INP cuantifică timpul de la momentul în care utilizatorul interacționează cu pagina (click, tap, tastare) până când browser-ul afișează vizual răspunsul la acea interacțiune. Procesul are trei componente distincte.

• Input delay: Timpul de așteptare până când browser-ul poate procesa interacțiunea. Este cauzat de task-uri lungi JavaScript care blochează thread-ul principal
• Processing duration: Timpul efectiv de execuție al handler-ului de eveniment
• Presentation delay: Timpul necesar browser-ului pentru a calcula layout-ul și a picta noua stare vizuală

Diferența față de FID

FID măsura doar prima interacțiune a utilizatorului cu pagina și ignora tot ce se întâmpla după. Un site putea să aibă FID excelent dar să ofere o experiență lentă pe parcursul întregii sesiuni.

INP rezolvă această problemă prin măsurarea celei mai lente interacțiuni din întreaga sesiune. Aceasta înseamnă că orice element interactiv — meniuri, formulare, filtre, butoane — trebuie să răspundă rapid, nu doar elementul cu care utilizatorul interacționează prima dată.

Cum identifici problemele INP pe site-ul tău

Primul pas este verificarea datelor din Google Search Console, secțiunea Core Web Vitals. Aceasta afișează procentul de URL-uri cu INP bun, care necesită îmbunătățire sau slab, bazat pe datele reale de utilizare (Chrome User Experience Report).

• PageSpeed Insights: Verificare rapidă pentru o pagină specifică, cu date de teren și de laborator
• Chrome DevTools: Panoul Performance permite înregistrarea și analiza detaliată a interacțiunilor
• web-vitals JavaScript library: Implementare în cod pentru măsurarea INP în producție
• RUM tools (Real User Monitoring): Sentry, Datadog, New Relic oferă INP agregat pe toți utilizatorii

Tehnici de optimizare INP

Principala cauză a INP slab este blocarea thread-ului principal JavaScript. Mai puțin de 25% din site-uri mențin durata task-urilor JavaScript sub pragul recomandat de 50ms per task.

Optimizarea input delay

Reduceți task-urile lungi JavaScript care rulează în thread-ul principal. Un task lung este orice task care durează mai mult de 50ms și blochează browser-ul să proceseze interacțiunile utilizatorului.

• Folosiți requestAnimationFrame pentru animații și actualizări vizuale
• Împărțiți task-urile lungi cu scheduler.yield() sau setTimeout(fn, 0)
• Delegați calculele grele către Web Workers (nu au acces la DOM, nu blochează UI)
• Amânați execuția JavaScript neesențial cu defer și async

Optimizarea processing duration

Handler-ele de eveniment complexe trebuie simplificate. Evitați operații costisitoare în răspuns direct la interacțiunea utilizatorului.

• Evitați recalcularea întregului layout la fiecare click sau tastare
• Implementați debounce și throttle pentru evenimentele frecvente (scroll, resize, input)
• Minimizați accesul la proprietățile DOM care forțează reflow (offsetWidth, getBoundingClientRect)

Optimizarea presentation delay

Reducerea complexității DOM-ului este esențială. Cu cât DOM-ul are mai multe elemente, cu atât calculul layout-ului durează mai mult după o interacțiune.

• Limitați adâncimea ierarhiei DOM la maximum 32 de niveluri
• Evitați layout-urile CSS complexe cu grid și flexbox înlănțuite adânc
• Folosiți content-visibility: auto pentru secțiunile din afara viewport-ului

INP și WordPress

Site-urile WordPress au provocări specifice legate de INP din cauza plugin-urilor care adaugă JavaScript neoptimizat. Instrumentele de caching și optimizare pot ajuta, dar nu sunt suficiente fără o analiză a scripturilor individuale.

Dezactivați JavaScript pentru plugin-urile care nu sunt necesare pe anumite pagini. Un plugin de slider activ pe toate paginile, inclusiv cele fără slider, poate deteriora INP global.

Concluzie

INP este un metric care reflectă direct calitatea experienței interactive a utilizatorilor dvs. Îmbunătățirile în INP reduc rata de abandon și cresc conversiile, independent de efectul asupra pozițiilor în Google.

Echipa opti-seo.ro realizează audituri tehnice complete care includ analiza Core Web Vitals și recomandări specifice de optimizare INP pentru platforma dvs.