Schon seit geraumer Zeit hat Chrome beim Wechsel zu einer neuen Seite konsequent den Bildschirm freigegeben, um Nutzern die Gewissheit zu geben, dass die Seite geladen wird. Dieses "weiße Blitzlicht" ist der kurze Moment, in dem der Browser beim Laden einer Seite weiß dargestellt wird. Dies kann zwischen den Navigationen ablenkend sein, insbesondere wenn die Seite relativ schnell einen interessanteren Zustand erreicht.
Bei Seiten, die blitzschnell geladen werden, wirkt sich dies jedoch nachteilig auf die Nutzererfahrung aus. In der folgenden Animation sehen Sie ein Beispiel dafür, wie das heute aussieht.
Wir sind große Fans dieser Website und das nervt, dass die Qualität der Website glänzend wirkt. Deshalb wollten wir das Problem beheben. Dazu wurde ein neues Verhalten eingeführt, das wir Paint Holding nennen. Dabei wartet der Browser kurz, bevor er mit dem Painting beginnt, insbesondere wenn die Seite schnell genug ist. Dadurch wird die Seite als Ganzes gerendert und bietet ein wirklich sofortiges Erlebnis.
Das funktioniert so: Commits werden so lange verzögert, bis ein bestimmtes Signal zum Laden der Seite (z.B. First Contentful Paint / feste Zeitüberschreitung) erreicht ist. Wir unterscheiden zwischen Rendering-Arbeiten des Hauptthreads und Commits für den impl-Thread (nur Letzteres wird zurückgestellt). Wenn Sie warten, bis ein PLS auftritt, verringert sich die Wahrscheinlichkeit, dass sie weiß oder einfarbig blinken.
Unser Ziel bei dieser Arbeit war es, zwischen zwei gleichartigen Seiten in Chrome nahtlos zu navigieren und so eine schnelle Standardnavigation ohne blinkende weiße oder einfarbige Hintergründe zwischen alten und neuen Inhalten zu bieten.
Testen Sie Paint Holding in Chrome Canary (Chrome 76) und teilen Sie uns Ihre Meinung mit. Entwickler sollten keine Änderungen an ihren Seiten vornehmen müssen, um davon zu profitieren.