Der Bericht zur Nutzererfahrung in Chrome soll der Web-Community helfen, die Verteilung und Entwicklung der Leistung echter Nutzer zu verstehen. Bisher haben wir uns auf Messwerte für das Rendern und Laden von Seiten wie „First Contentful Paint“ (FCP) und „Onload“ (OL) konzentriert. So konnten wir besser nachvollziehen, wie Websites visuell für Nutzer abschneiden. Seit der Juni-Version 2018 testen wir einen neuen nutzerorientierten Messwert, der sich auf die Interaktivität von Webseiten konzentriert: den First Input Delay (FID). Mit diesem neuen Messwert können wir besser nachvollziehen, wie reaktionsschnell Websites auf Nutzereingaben reagieren.
FID wurde vor Kurzem in Chrome als Ursprungstest zur Verfügung gestellt. Websites können also diese neue Webplattformfunktion ausprobieren. Ebenso ist der FID im Chrome UX Report als experimenteller Messwert verfügbar. Das bedeutet, dass er während der Dauer des Ursprungstests in einem separaten Namespace „experimentell“ verfügbar ist.
Messung der FID
Was ist also genau eine FID? Im Blogpost zur Einführung von First Input Delay wird dies so definiert:
Der First Input Delay (FID) gibt an, wie viel Zeit zwischen der ersten Interaktion eines Nutzers mit Ihrer Website (z.B. Klicken auf einen Link, Tippen auf eine Schaltfläche oder Verwenden eines benutzerdefinierten, von JavaScript bereitgestellten Steuerelements) bis zu dem Zeitpunkt liegt, an dem der Browser tatsächlich auf diese Interaktion reagieren kann.
Das ist vergleichbar mit der Messung der Zeit, die vergeht, bis jemand die Tür öffnet, nachdem Sie an der Türklingel geklingelt haben. Wenn es lange dauert, kann das viele Gründe haben. Zum Beispiel, weil die Person vielleicht weit von der Tür entfernt ist oder sie sich nicht schnell bewegen kann. Ebenso kann es sein, dass Webpages gerade mit anderen Aufgaben beschäftigt sind oder das Gerät des Nutzers zu langsam ist.
FID im Chrome UX Report untersuchen
Mit einem Monat FID-Daten aus Millionen von Quellen lassen sich bereits viele interessante Statistiken ermitteln. Sehen wir uns einige Abfragen an, die zeigen, wie Sie diese Statistiken aus dem Chrome-UX-Bericht in BigQuery extrahieren.
Rufen Sie zuerst den Prozentsatz der schnellen FIDs für developers.google.com ab. Wir definieren eine schnelle Nutzererfahrung als eine, bei der der FID weniger als 100 ms beträgt. Gemäß den RAIL-Empfehlungen sollte die Verzögerung 100 ms oder weniger betragen, damit die Website für den Nutzer sofort angezeigt wird.
SELECT
ROUND(SUM(IF(fid.start < 100, fid.density, 0)), 4) AS fast_fid
FROM
`chrome-ux-report.all.201806`,
UNNEST(experimental.first_input_delay.histogram.bin) AS fid
WHERE
origin = 'https://developers.google.com'
Die Ergebnisse zeigen, dass 95% der FID-Erlebnisse hier als sofort wahrgenommen werden. Das klingt sehr gut, aber wie schneidet es im Vergleich zu allen Ursprüngen im Datensatz ab?
SELECT
ROUND(SUM(IF(fid.start < 100, fid.density, 0)) / SUM(fid.density), 4) AS fast_fid
FROM
`chrome-ux-report.all.201806`,
UNNEST(experimental.first_input_delay.histogram.bin) AS fid
Die Ergebnisse dieser Abfrage zeigen, dass 84% der FID-Erlebnisse weniger als 100 ms betragen. Das bedeutet, dass developers.google.com über dem Durchschnitt liegt.
Als Nächstes sehen wir uns an, ob es einen Unterschied zwischen dem Prozentsatz der schnellen FIDs auf dem Computer und auf Mobilgeräten gibt. Eine Hypothese ist, dass Mobilgeräte langsamere FID-Werte haben, möglicherweise aufgrund der langsameren Hardware im Vergleich zu Desktop-Computern. Wenn die CPU weniger leistungsstark ist, ist sie möglicherweise länger ausgelastet und die FID ist langsamer.
SELECT
form_factor.name AS form_factor,
ROUND(SUM(IF(fid.start < 100, fid.density, 0)) / SUM(fid.density), 4) AS fast_fid
FROM
`chrome-ux-report.all.201806`,
UNNEST(experimental.first_input_delay.histogram.bin) AS fid
GROUP BY
form_factor
| form_factor | fast_fid |
|---|---|
| desktop | 96,02% |
| Telefon | 79,90 % |
| Tablet | 76,48% |
Die Ergebnisse bestätigen unsere Hypothese. Computer haben eine höhere kumulative Dichte an schnellen FID-Erlebnissen als Smartphones und Tablets. Um zu verstehen, warum diese Unterschiede bestehen, z. B. bei der CPU-Leistung, wären A/B-Tests erforderlich, die nicht in den Chrome-UX-Bericht fallen.
Nachdem wir nun wissen, wie wir feststellen können, ob eine Quelle eine schnelle FID hat, sehen wir uns einige Quellen mit sehr guter Leistung an.
Beispiel 1: http://secretlycanadian.com
Bei dieser Quelle liegt der FID 98 % der Fälle unter 100 Millisekunden. Wie ist das möglich? Bei der Analyse mit WebPageTest stellen wir fest, dass es sich um eine recht bildlastige WordPress-Seite handelt. Sie hat jedoch 168 KB JavaScript, das auf unserem Laborcomputer in etwa 500 ms ausgeführt wird. Das ist laut HTTP Archive nicht viel JavaScript. Damit liegt diese Seite im 28. Perzentil.
Die rosafarbene Leiste, die 2,7 bis 3,0 Sekunden umfasst, ist die Phase HTML parsen. Während dieser Zeit ist die Seite nicht interaktiv und erscheint optisch unvollständig (siehe „3,0 Sekunden“ im Filmstreifen oben). Danach werden alle langen Aufgaben, die verarbeitet werden müssen, aufgeteilt, damit der Hauptthread inaktiv bleibt. Die rosa Linien in Zeile 11 zeigen, wie die JavaScript-Funktion in kurzen Abständen verteilt ist.
Beispiel 2: https://www.wtfast.com
Dieser Ursprung bietet eine Instant-FID-Funktion von 96%. Es lädt 267 KB JavaScript (38. Perzentil im HTTP-Archiv) und verarbeitet es 900 ms lang auf dem Lab-Rechner. Der Filmstreifen zeigt, dass die Seite etwa 5 Sekunden für das Zeichnen des Hintergrunds und etwa 2 weitere Sekunden für das Zeichnen des Inhalts benötigt.
Das Interessanteste an den Ergebnissen ist, dass nichts Interaktives zu sehen ist, während der Hauptthread zwischen 3 und 5 Sekunden beschäftigt ist. Tatsächlich ist es die langsame FCP-Konfiguration dieser Seite, die den FID verbessert. Dies ist ein gutes Beispiel dafür, wie wichtig es ist, viele Messwerte zu verwenden, um die Nutzerfreundlichkeit darzustellen.
Jetzt erkunden
Weitere Informationen zum FID finden Sie in der aktuellen Folge von The State of the Web:
Durch die Verfügbarkeit von FID im Chrome-UX-Bericht können wir eine Grundlage für die Interaktivität schaffen. Mit dieser Referenz können wir deren Änderung in zukünftigen Releases beobachten oder einzelne Ursprünge Benchmarking betreiben. Wenn Sie FIDs in den Feldmessungen Ihrer eigenen Website erfassen möchten, registrieren Sie sich für den Test für die Herkunftsquelle unter bit.ly/event-timing-ot und wählen Sie die Funktion „Ereigniszeitpunkt“ aus. Und natürlich können Sie den Datensatz untersuchen, um interessante Einblicke in den Stand der Interaktivität im Web zu erhalten. Dieser Messwert ist noch experimentell. Bitte geben Sie uns Feedback und teilen Sie uns Ihre Analyse in der Diskussionsgruppe zum Chrome UX-Bericht oder unter @ChromeUXReport auf Twitter mit.