Glossaire · Vitesse et expérience mobile
INP – Interaction to Next Paint
On dit aussi Réactivité aux interactionsInteraction jusqu’au prochain affichage
L’INP (Interaction to Next Paint) mesure la réactivité d’une page : le temps qui s’écoule entre une action de l’utilisateur — clic, appui, frappe au clavier — et le moment où l’écran affiche le résultat. Il fait partie des Core Web Vitals depuis mars 2024, où il a remplacé le FID.
Points clés
- Core Web Vital depuis mars 2024, à la place du FID
- Prend en compte toutes les interactions de la visite, pas seulement la première
- Bon en dessous de 200 ms, à améliorer jusqu’à 500 ms, mauvais au-delà
À ne pas confondre avec
- LCP – Largest Contentful Paint
Le LCP mesure quand la page s’affiche. L’INP mesure si elle répond vite quand on s’en sert.
- FID (First Input Delay)
Le FID ne mesurait que le délai avant la réponse à la première interaction. L’INP mesure toutes les interactions de la visite, jusqu’à l’affichage du résultat : il a remplacé le FID en mars 2024.
Pourquoi c’est important
Une page peut s’afficher vite et répondre lentement : un menu qui s’ouvre avec retard, un bouton qui semble ne rien faire. L’INP mesure cette impression sur toute la durée de la visite, là où le FID ne regardait que la première interaction. Un mauvais INP pèse sur l’expérience et sur les conversions, et il entre dans les signaux d’expérience de page de Google.
Bonnes pratiques
- Découper les longues tâches JavaScript pour rendre la main au navigateur
- Alléger ou différer les scripts tiers (chat, publicité, suivi)
- Garder des gestionnaires d’événements courts et reporter le travail non urgent
- Réduire la taille du DOM et éviter les recalculs de mise en page à chaque interaction
- Suivre l’INP réel dans la Search Console et dans PageSpeed Insights
En code
// Entre deux lots, le navigateur peut répondre à un clic ou à une frappe.
const pause = () =>
"scheduler" in window && "yield" in scheduler
? scheduler.yield()
: new Promise((suite) => setTimeout(suite, 0));
async function filtrer(produits) {
for (let i = 0; i < produits.length; i += 50) {
produits.slice(i, i + 50).forEach(afficher);
await pause();
}
}
Exemple concret
Sur une boutique en ligne, le filtre des produits mettait 600 ms à réagir sur mobile. → Le script de filtrage est découpé en petites tâches et le chat est différé → l’INP passe sous 200 ms, et les visiteurs cessent de cliquer deux fois.
Besoin d’un coup de main ?
Développement Un site rapide et stable, sur téléphone comme sur ordinateur. Voir la prestationVous hésitez sur la priorité ? Le diagnostic vous remet une solution écrite, à prix fixe et sans engagement.
