Interaction to Next Paint (INP) e un Core Web Vital di Google che misura la reattivita di una pagina web. Registra il ritardo piu lungo tra un interazione utente (clic, tap, tasto) e il successivo aggiornamento visivo durante l intera visita e riporta il 75esimo percentile sulle sessioni reali. INP e diventato Core Web Vital ufficiale e segnale di ranking il 12 marzo 2024, sostituendo First Input Delay (FID). Buon INP: 200 ms o meno. Misurato su utenti Chrome reali via CrUX, disponibile in Search Console, PageSpeed Insights, Chrome DevTools e libreria web-vitals.
Come si misura INP
- Input delay.
- Processing time.
- Presentation delay.
Soglie
| Categoria | Valore | Sensazione |
|---|---|---|
| Buono | 200 ms o meno | Istantaneo. |
| Da migliorare | 200 a 500 ms | Latenza percepibile. |
| Pessimo | Oltre 500 ms | Visibilmente lento. |
A febbraio 2025 circa il 65 percento degli URL mobile in CrUX supera la soglia, contro il 55 percento al lancio di marzo 2024.
Perche ha sostituito FID
- FID misurava solo la prima interazione.
- FID non includeva elaborazione o render.
Cause di INP scadente
- Long task sul main thread.
- Script di terze parti sincroni.
- Handler pesanti.
- Layout thrashing.
- Rerender lenti dei framework.
- Animazioni JS invece di CSS.
- Ricalcoli CSS su DOM enormi.
Misurazione
- PageSpeed Insights.
- Search Console.
- Chrome DevTools (da Chrome 121).
- web-vitals (
npm install web-vitals). - Cloudflare Web Analytics, Vercel Speed Insights, SpeedCurve, DebugBear.
- CrUX su BigQuery.
import { onINP } from 'web-vitals';
onINP(metric => {
fetch('/api/vitals', { method: 'POST', body: JSON.stringify(metric), keepalive: true });
});Ottimizzazione
- Spezzare long task con
scheduler.yield()(Chrome 129, ottobre 2024). - Rinviare JS non critico.
- Idratazione parziale (Astro, RSC, Qwik).
- Memoizzare componenti React.
- Animazioni CSS.
- Debounce degli handler.
- Web Workers per parsing pesante.
- Ridurre il DOM.
content-visibility: auto.- Audit script di terze parti.
INP in WordPress
- Disattivare jQuery nel frontend.
- Tema veloce (GeneratePress, Astra, Kadence).
- Evitare page builder pesanti.
- Caricare GTM e analytics in ritardo.
- Cache.
- WooCommerce o headless.
- Limitare i widget di chat.
- Misurare con Site Kit by Google.
Miti
- Lighthouse 100 non garantisce buon INP reale.
- Meno JS aiuta solo se era bloccante.
- INP conta mobile e desktop separatamente.
- INP non e TBT.
Come InspectWP aiuta?
InspectWP rileva jQuery nel frontend, script bloccanti e page builder lenti.