INP-Audits: Warum echte Interaktionen wichtiger sind als ein schneller erster Seitenaufruf
Interaction to Next Paint zeigt, ob eine Website nach dem Laden wirklich schnell reagiert. Website-Teams sollten deshalb echte Nutzerflüsse, JavaScript-Arbeit und Formularinteraktionen prüfen.
Viele Performance-Checks bleiben beim ersten Seitenaufruf stehen. Die Startseite lädt, Lighthouse sieht ordentlich aus, Bilder sind komprimiert, der Largest Contentful Paint ist okay. Trotzdem fühlt sich die Website für Nutzer:innen zäh an: Menüs reagieren verzögert, Filter hängen, Formulare brauchen einen Moment, der Warenkorb öffnet zu spät oder ein Cookie-Banner blockiert den ersten Klick.
Genau für diese Fälle ist Interaction to Next Paint, kurz INP, wichtig. INP bewertet nicht nur den ersten Kontakt mit der Seite, sondern die Reaktionsfähigkeit über die Nutzung hinweg. Laut web.dev misst INP die Latenz von Klick-, Tipp- und Tastaturinteraktionen und fasst sie zu einem Wert zusammen, der die allgemeine Reaktionsfähigkeit einer Seite beschreibt. Gute Werte liegen bei 200 Millisekunden oder darunter, Werte über 500 Millisekunden gelten als schlecht.
Warum INP ein Wartungsthema ist
Schlechte Interaktivität entsteht selten durch eine einzelne große Katastrophe. Häufig sind es viele kleine Entscheidungen:
- ein Cookie-Banner mit schwerem Skript,
- ein Tag Manager mit alten Marketing-Tags,
- ein React- oder Vue-Component-Tree, der bei jedem Klick zu viel neu rendert,
- ein Filter, der große Listen synchron verarbeitet,
- ein Checkout, der Validierung, Tracking und UI-Updates im selben Moment erledigt,
- ein WordPress-Plugin, das Frontend-JavaScript auf jeder Seite lädt.
Das Problem: Diese Dinge werden oft nachträglich ergänzt. Eine Website kann beim Launch schnell sein und ein Jahr später durch Kampagnen, Plugins und neue Features deutlich träger wirken. Deshalb gehört INP nicht nur in den Relaunch, sondern in die laufende Wartung.
Feldmessung statt Bauchgefühl
Labortools sind nützlich, aber INP braucht Kontext. web.dev empfiehlt, möglichst mit Felddaten zu starten, weil echte Nutzer:innen andere Geräte, Netzwerke und Interaktionsmuster haben als ein lokaler Test. PageSpeed Insights und der Chrome User Experience Report können einen ersten Blick geben, wenn ausreichend Daten vorhanden sind. Für genauere Ursachen braucht es oft Real User Monitoring.
Ein gutes INP-Setup sollte nicht nur einen Wert speichern, sondern auch erklären, welche Interaktion langsam war:
- Welche URL war betroffen?
- War es ein Klick, Tap oder Tastaturereignis?
- Welches Element wurde genutzt?
- Passierte es beim Laden oder später?
- War der Main Thread durch JavaScript blockiert?
- Gab es große Layout- oder Render-Arbeit nach dem Event?
Ohne diese Details endet Performance-Arbeit schnell bei zufälligem Code-Aufräumen. Mit diesen Details kann ein Team gezielt an den Interaktionen arbeiten, die Nutzer:innen wirklich spüren.
Praktischer INP-Audit für Website-Teams
Ein pragmatischer Audit beginnt mit den wichtigsten Nutzerflüssen, nicht mit der schönsten Homepage:
- Cookie-Auswahl: Reagieren Ablehnen, Akzeptieren und Einstellungen sofort?
- Navigation: Öffnen Mobile-Menü, Suche und Dropdowns ohne spürbare Verzögerung?
- Formulare: Blockiert Validierung die Eingabe oder den Absenden-Klick?
- Filter und Suche: Werden große Listen synchron im Browser verarbeitet?
- Checkout oder Buchung: Passieren Tracking, API-Aufrufe und UI-Updates geordnet?
- Account-Bereich: Reagieren Tabs, Modale und Speichern-Aktionen schnell?
- Drittanbieter: Welche Widgets laden JavaScript, das Interaktionen beeinflusst?
Besonders wichtig: nicht nur Desktop testen. INP-Probleme zeigen sich oft auf schwächeren Mobilgeräten, während Entwickler-Laptops alles scheinbar problemlos wegatmen.
Typische technische Gegenmaßnahmen
Wenn langsame Interaktionen gefunden sind, helfen meist sehr konkrete Maßnahmen:
- Lange Tasks aufteilen und schwere Arbeit aus Event-Handlern entfernen.
- Rendering nach Klicks reduzieren und unnötige Re-Renders vermeiden.
- Große Listen virtualisieren oder serverseitig filtern.
- Teure Berechnungen debouncen, throttlen oder in Web Worker verschieben.
- Sofort visuelles Feedback geben, bevor Netzwerkarbeit abgeschlossen ist.
- Drittanbieter-Skripte kritisch prüfen und nur dort laden, wo sie gebraucht werden.
- Tag Manager, Consent Tool und Tracking regelmäßig ausmisten.
Das Ziel ist nicht, jede Interaktion magisch sofort fertig zu machen. Das Ziel ist, Nutzer:innen schnell zu zeigen, dass die Seite reagiert.
Was in die Website-Dokumentation gehört
Für professionelle Website-Wartung sollte INP Teil der Betriebsdokumentation werden:
- Welche Seiten und Flows gelten als kritisch?
- Welche Performance-Budgets gelten für Interaktionen?
- Wo werden Felddaten gemessen?
- Wer prüft neue Drittanbieter-Skripte?
- Welche Komponenten sind bekannt empfindlich?
- Wann wird nach Relaunch, Plugin-Update oder Kampagnenstart erneut getestet?
So wird Performance nicht zum einmaligen Audit, sondern zu einem wiederholbaren Qualitätsprozess.
Fazit
INP erinnert Website-Teams daran, dass Performance nicht beim Laden endet. Eine Website muss auch nach dem ersten Render zuverlässig reagieren. Wer echte Nutzerflüsse misst, langsame Interaktionen dokumentiert und JavaScript-Arbeit begrenzt, verbessert nicht nur Metriken, sondern Vertrauen: Die Seite fühlt sich kontrolliert, stabil und professionell an.