INP sostituisce FID dal 12 marzo: come rendere il tuo sito più reattivo ai clic

Dal 12 marzo Interaction to Next Paint entra tra i Core Web Vitals al posto di First Input Delay. Misura tutte le interazioni, non solo la prima, e molti siti che andavano bene risulteranno lenti.

INP sostituisce FID dal 12 marzo: come rendere il tuo sito più reattivo ai clic

Dal 12 marzo 2024 Interaction to Next Paint, per tutti INP, prende il posto di First Input Delay tra i Core Web Vitals di Google. L’annuncio era arrivato lo scorso maggio, proprio per dare tempo ai siti di prepararsi. Se non hai ancora guardato i tuoi numeri, potresti avere una sorpresa.

FID misurava soltanto il ritardo della prima interazione, cioè quanto il browser aspettava prima di cominciare a gestire il primo clic. Lo superavano quasi tutti, ed era proprio questo il suo limite. INP osserva tutte le interazioni della visita, clic, tocchi e tasti premuti, e misura il tempo che passa fino a quando la pagina mostra il risultato. Il valore riportato è vicino al caso peggiore. Le soglie sono queste:

  • buono fino a 200 millisecondi;
  • da migliorare tra 200 e 500 millisecondi;
  • scarso oltre 500 millisecondi.

Un sito che con FID risultava in ordine può finire così nella fascia gialla o rossa senza che sia cambiata una riga di codice.

Da dove arriva la lentezza

Quasi sempre il colpevole è il JavaScript che occupa il thread principale: finché non ha finito, il browser non può rispondere. Gli script di terze parti, come chat, pixel pubblicitari e strumenti di analisi e test, pesano più di quanto sembri. Poi ci sono i gestori di eventi che fanno troppo lavoro prima di aggiornare la pagina, i DOM enormi in cui ogni modifica costa molto ricalcolo e i page builder che caricano librerie su ogni pagina, anche dove non servono.

La correzione più efficace è spesso la più semplice: dai subito un riscontro visivo, come un pulsante che cambia stato, e rimanda il resto del lavoro. Spezza i compiti lunghi in parti più piccole, restituendo il controllo al browser tra una parte e l’altra. Carica solo il JavaScript che serve alla pagina e rinvia il resto. Elimina le terze parti inutili e carica le altre dopo la prima interazione. Sulle pagine più complesse, semplifica il DOM.

Comincia dal rapporto Core Web Vitals di Search Console e da PageSpeed Insights, poi usa gli strumenti per sviluppatori di Chrome per trovare le interazioni più lente. Lavora prima sui modelli di pagina con più traffico. I dati reali si aggiornano su una finestra di 28 giorni: ricontrolla dopo quattro settimane, non il giorno dopo.

Condividi LinkedIn X Telegram

Continua a leggere