Paint Holding: reduzindo o flash de branco em navegações de mesma origem.

Há algum tempo, o Chrome já apagou a tela ao fazer a transição para uma nova página para dar aos usuários a certeza de que ela está sendo carregada. Esse "branco" é um breve momento em que o navegador mostra uma tinta branca ao carregar uma página. Isso pode distrair as navegações, especialmente quando a página está razoavelmente rápida para chegar a um estado mais interessante.

No entanto, para páginas que carregam muito rápido, essa abordagem é prejudicial à experiência do usuário. Na animação a seguir, você verá um exemplo de como isso está acontecendo hoje.

Somos grandes fãs desse site, e ele nos mata porque a experiência de qualidade dele tem um flash branco, e queríamos corrigir isso. Fizemos isso com um novo comportamento que chamamos de Paint Holding, em que o navegador aguarda brevemente antes de começar a pintar, especialmente se a página for rápida o suficiente. Isso garante que a página seja renderizada como um todo, oferecendo uma experiência verdadeiramente instantânea.

Para isso, adiamos as confirmações do compositor até que um determinado sinal de carregamento de página (PLS, na sigla em inglês) seja atingido, como a primeira exibição de conteúdo ou o tempo limite fixo. Diferenciamos o trabalho de renderização da linha de execução principal e a confirmação com a linha de execução de implantação (somente a última é adiada). A espera até que um PLS ocorra reduz a probabilidade de piscos de branco/cor sólida.

Nosso objetivo com esse trabalho era que as navegações no Chrome entre duas páginas de mesma origem fossem perfeitas e, assim, proporcionem uma experiência de navegação padrão rápida sem flash de fundo branco/cor sólida entre o conteúdo antigo e novo.

Teste o Paint Holding no Chrome Canary (Chrome 76) e nos conte o que você achou. Os desenvolvedores não precisam se preocupar em fazer modificações nas páginas para aproveitá-lo.