INP (Interaction to Next Paint) : Le Guide Core Web Vitals 2026

En 2026, la vitesse de chargement ne suffit plus. Un site peut charger rapidement mais paraître "mou" ou "bloqué" lorsque l'utilisateur essaie de cliquer sur un menu ou de remplir un formulaire. C'est ici qu'intervient l'INP (Interaction to Next Paint). Cette métrique Google est devenue le juge de paix de l'expérience utilisateur moderne. Si votre site ne répond pas instantanément au doigt et à l'œil, Google pénalisera votre ranking.

Comprendre l'INP : Au-delà de la FID

Contrairement à la FID qui ne mesurait que le délai de la toute première interaction, l'INP observe **toutes les interactions** (clics, taps, touches de clavier) pendant toute la vie de la page. Elle retient la plus longue latence constatée.

Les 3 phases d'une interaction

• Input Delay : Le temps que met le navigateur à commencer à traiter l'événement (souvent à cause d'un Main Thread surchargé).
• Processing Time : Le temps d'exécution du code JavaScript associé à l'interaction.
• Presentation Delay : Le temps nécessaire au navigateur pour recalculer le layout et afficher le changement à l'écran.

Comment optimiser l'INP en 2026

1. Réduire les Long Tasks JavaScript

Une "Long Task" est un script qui bloque le Main Thread pendant plus de 50ms. En 2026, nous utilisons le **Yielding**. En découpant vos scripts volumineux en petites tâches via `scheduler.yield()` ou `setTimeout()`, vous permettez au navigateur de glisser une réponse à l'utilisateur entre deux calculs.

2. Optimiser les sélecteurs et le DOM

Un DOM trop profond (plus de 1500 nœuds) ralentit le "Presentation Delay". Chaque interaction oblige le navigateur à recalculer une partie de l'arborescence. Restez léger, utilisez des composants Web natifs ou des frameworks modernes comme Astro qui limitent le JS côté client.

Mesurer l'INP comme un Pro

Lighthouse donne un score théorique (Lab Data), mais seul le **RUM (Real User Monitoring)** compte pour Google.

• ✓ Google Search Console : Consultez l'onglet "Signaux Web Essentiels" pour voir vos scores réels basés sur Chrome User Experience Report (CrUX).
• ✓ Web-Vitals Extension : Testez manuellement vos interactions sur votre navigateur pour identifier les boutons qui "laguent".

L'impact de l'INP sur votre business

Une étude de 2025 montre que les sites avec un score INP "Good" (< 200ms) ont un taux d'abandon de panier inférieur de 11% aux sites classés "Poor" (> 500ms). La réactivité perçue crée un sentiment de fluidité et de professionnalisme qui favorise la conversion.

Questions fréquentes

Pourquoi mon score INP est-il mauvais sur mobile alors qu'il est bon sur desktop ?

Les processeurs mobiles sont beaucoup moins puissants. Un script JavaScript qui prend 30ms sur un PC peut en prendre 300ms sur un smartphone milieu de gamme, bloquant ainsi l'interaction.

Est-ce que les scripts tiers (analytics, chat) impactent l'INP ?

Oui, massivement. Chaque script tiers qui s'exécute sur le Main Thread peut bloquer une interaction utilisateur. En 2026, la bonne pratique est de charger ces scripts via un **Web Worker** (ex: Partytown).

Quelle est la valeur cible pour un score INP 'Excelent' ?

Google considère qu'un score inférieur à 200ms est 'Good'. Pour être parmi les meilleurs du web dans les secteurs compétitifs, nous visons souvent moins de 100ms.