Depuis un certain temps maintenant, Chrome efface l'écran lors de la transition vers une nouvelle page pour rassurer les utilisateurs que celle-ci se charge. Ce "flash de blanc" correspond à ce bref moment au cours duquel le navigateur affiche une peinture blanche lors du chargement d'une page. Cela peut distraire l'attention entre les navigations, en particulier lorsque la page atteint un état plus intéressant rapidement.
Toutefois, pour les pages qui se chargent très rapidement, cette approche est en réalité néfaste pour l'expérience utilisateur. Dans l'animation suivante, vous verrez un exemple de ce à quoi cela ressemble aujourd'hui.
Nous sommes de grands fans de ce site Web, et il nous tue que leur expérience de qualité a un flash de blanc et nous voulions y remédier. Nous l'avons fait avec un nouveau comportement appelé "Paint Holding", qui permet au navigateur d'attendre brièvement avant de commencer à peindre, surtout si la page est suffisamment rapide. Cela garantit que la page s'affiche dans son ensemble, offrant ainsi une expérience vraiment instantanée.
En procédant ainsi, nous reportons les commits du compositeur jusqu'à ce qu'un signal de chargement de page (PLS) donné (par exemple, First Contentful Paint / Délai d'expiration fixe) soit atteint. Nous faisons la distinction entre le travail de rendu du thread principal et la validation dans le thread implicite (seul ce dernier est différé). Attendre qu'un PLS se produise réduit le risque de flashs blancs/unis.
L'objectif de ce travail était de garantir une navigation fluide entre deux pages de même origine dans Chrome, et ainsi d'offrir une expérience de navigation par défaut rapide, sans clignoter d'arrière-plan blanc ou uni entre l'ancien et le nouveau contenu.
Essayez Paint Holding dans Chrome Canary (Chrome 76) et dites-nous ce que vous en pensez. Les développeurs ne doivent pas avoir à apporter de modifications à leurs pages pour en profiter.