„Interaction to Next Paint“ ist jetzt ein stabiler Core Web Vitals-Messwert und ersetzt „First Input Delay“.
Es ist endlich so weit! Nach jahrelanger Arbeit sind wir nun bereit, Interaction to Next Paint (INP) zu einem stabilen Core Web Vital-Messwert zu machen. Dies stellt einen bedeutenden Schritt nach vorne bei der Messung der Reaktionsfähigkeit von Interaktionen und beseitigt viele der Mängel in Bezug auf First Input Delay (FID).
<ph type="x-smartling-placeholder">In diesem Beitrag fassen wir kurz zusammen, was sich heute genau ändert, setzen einen genaueren Zeitplan für die Einstellung und Entfernung von FID aus den Chrome-Tools und geben einige Ressourcen an, die Ihnen bei der Suche und Behebung von INP-Problemen helfen.
Was ändert sich heute?
Bei Chrome spiegeln alle unsere Core Web Vitals-Tools jetzt gegebenenfalls den stabilen Status von INP wider. In Tools wie PageSpeed Insights, dem CrUX-Dashboard und der Web Vitals-Erweiterung wird INP beispielsweise in den drei Core Web Vitals-Messwerten hervorgehoben. Insbesondere in PageSpeed Insights bewertet die Core Web Vitals-Bewertungslogik die INP-Leistung anstelle der FID. Weitere Informationen zu den entsprechenden Änderungen an der Search Console finden Sie im Blogpost des Search-Teams.
Außerdem wird ab heute bei einigen Tools möglicherweise ein Hinweis zur Einstellung von FID angezeigt, um darauf hinzuweisen, dass der Messwert kein Core Web Vital mehr ist und entfernt wird. Im folgenden Abschnitt Zeitplan für die Einstellung von FID finden Sie die Termine, die Sie kennen müssen, um die vollständige Umstellung von FID zu gewährleisten.
Zeitplan für die Einstellung der FID
Da INP jetzt FID als Core Web Vitals-Messwert abgelöst hat, stellt Chrome die Unterstützung für FID offiziell ein. Das bedeutet, dass die Verfügbarkeit von FID in Chrome-Tools nicht mehr garantiert wird und Entwickler bis zum 9. September 2024 Zeit haben, zu INP zu wechseln.
Das ist besonders wichtig für Nutzer der Chrome User Experience Report (CrUX) oder der PageSpeed Insights APIs. Anwendungen, die FID-Daten von einer dieser APIs verarbeiten, müssen bis zum 9. September auf INP umgestellt werden, um Dienst- oder Dienstunterbrechungen zu vermeiden. Dies wird eine funktionsgefährdende Änderung in den neuesten Versionen der APIs sein und es wird keine Erhöhung der Hauptversionszahlen geben.
Ressourcen zur Optimierung von INP
Unabhängig davon, ob Sie sich zum ersten Mal mit INP befassen oder bereits ein Experte für responsives Webdesign sind, ist die Sammlung von Ressourcen zur INP-Optimierung ein guter Ausgangspunkt, um das Gewünschte zu finden. Diese zeitlose Dokumentation umfasst alles – von der Definition des Messwerts selbst über Techniken zur lokalen Messung des Messwerts und mit realen Nutzern über praktische Ratschläge zur Optimierung verschiedener Anwendungsfälle bis hin zu einer Liste von Fallstudien aus der Praxis, die die Leitlinien in der Praxis zeigen.
Mithilfe dieser Dokumente können Sie dem folgenden allgemeinen Workflow folgen, um INP-Probleme auf Ihrer Website zu finden und zu beheben:
In den kanonischen INP-Dokumenten können Sie sich darüber informieren, wie INP die Reaktionsfähigkeit auf Nutzerinteraktionen misst.
Analysieren Sie reale Nutzerdaten, um die INP-Leistung Ihrer Website zu bewerten. Mindestens 75% der INP-Tests sollten in weniger als 200 Millisekunden auf Nutzereingaben reagieren, um als gut zu gelten. Wenn Ihre Website bereits einen guten INP hat, machen Sie sich keine Sorgen!
Fügen Sie Ihre URL in PageSpeed Insights ein oder prüfen Sie den Core Web Vitals-Bericht in der Search Console, falls Ihre Website im CrUX-Dataset enthalten ist.
Erkundigen Sie sich bei Ihrem Analyseanbieter, ob er INP-Monitoring unterstützt.
Erstellen Sie Ihre eigene INP-Lösung mithilfe von web-vitals.js.
Falls erforderlich, sollten Sie Ihre Website so einrichten, dass Diagnosedaten zur Nutzererfahrung erfasst werden. Dies sind wichtige Metadaten, z. B. mit welchem Seitenelement der Nutzer interagiert hat und warum es langsam war, sowie andere nützliche Daten. Zusammengefasst helfen Ihnen diese Informationen, die größten Verbesserungsmöglichkeiten zu erkennen.
Reproduzieren Sie die langsamen Interaktionen lokal mit den Chrome-Entwicklertools. So kannst du genau sehen, was im Hintergrund passiert und um welchen Code es sich handelt.
Optimieren Sie den Code so, dass er bei der Verarbeitung einer Nutzerinteraktion so wenig Arbeit wie möglich macht:
Messen Sie Ihre Änderungen lokal und überwachen Sie die Erfahrungen der Nutzer in Ihrer Praxis, um sicherzustellen, dass Ihre INP-Leistung schnell (und stabil) läuft.
Wir hoffen, dass Ihnen diese Informationen den richtigen Weg zur Optimierung von INP geben. Bei Problemen können Sie jederzeit Hilfe erhalten, indem Sie auf Stack Overflow eine Frage mit dem Tag interaction-to-next-paint
posten.
Die Einführung von INP als Core Web Vital hat lange gedauert – blicken wir auf unseren ersten Beitrag zum Thema Bessere Reaktionsgeschwindigkeit aus dem Jahr 2021 zurück. Seitdem haben wir das großartige Feedback der Community berücksichtigt und einen Messwert entwickelt, der Entwickler dabei unterstützen soll, einen unterversorgten Bereich der Nutzererfahrung zu verbessern und letztlich zu einem besseren Web zu führen. Vielen Dank für Ihre Hilfe beim Ausarbeiten dieses Messwerts und für Ihre harte Arbeit, um die Reaktionsfähigkeit zu verbessern!