Apresentação da NoState Prefetch

Katie Hempenius
Katie Hempenius

introdução

A NoState Prefetch é um novo mecanismo no Chrome que é uma alternativa ao processo de pré-renderização descontinuado, usado para potencializar recursos como o <link rel="prerender">. Assim como a pré-renderização, ela busca recursos com antecedência. No entanto, diferentemente da pré-renderização, ele não executa o JavaScript nem renderiza nenhuma parte da página com antecedência. O objetivo da NoState Prefetch é usar menos memória do que a pré-renderização e ainda reduzir o tempo de carregamento da página.

O NoState Prefetch não é uma API, mas um mecanismo usado pelo Chrome para implementar várias APIs e recursos. A API Resource Hints e a pré-busca de páginas pela barra de endereço do Chrome são implementadas usando a pré-busca NoState. Se você estiver usando o Chrome 63 ou posterior, seu navegador já está usando o NoState Prefetch para recursos como <link rel="prerender">.

Este artigo explica como o NoStatePrefetch funciona, as motivações para apresentá-lo e instruções para usar os histogramas do Chrome para visualizar estatísticas sobre o uso dele.

Motivação

Houve duas motivações principais para a introdução do NoState Prefetch:

Reduzir o uso da memória

A pré-busca NoState usa apenas cerca de 45 MiB de memória. A manutenção do scanner de pré-carregamento é a despesa de memória principal do NoState Prefetch e esse custo permanece relativamente constante em diferentes casos de uso. Aumentar o tamanho ou o volume das buscas não tem um efeito significativo na quantidade de memória consumida pelo NoState Prefetch.

Por outro lado, a pré-renderização normalmente consome 100 MiB de memória, e o consumo de memória é limitado a 150 MiB. Esse alto consumo de memória o torna inadequado para dispositivos mais simples (ou seja, com menos de 512 MB de RAM). Como resultado, o Chrome não faz a pré-renderização em dispositivos mais simples. Em vez disso, ele pré-conecta.

Facilitar o suporte a novos recursos da plataforma da Web

Com a pré-renderização, não vai ocorrer nenhuma ação voltada ao usuário (por exemplo, reprodução de música ou vídeo) nem com estado (por exemplo, a desativação da sessão ou do armazenamento local). No entanto, pode ser difícil e complexo evitar que essas ações ocorram durante a renderização de uma página. A NoState Prefetch só busca recursos com antecedência: ela não executa código nem renderiza a página. Isso simplifica a prevenção de ações voltadas para o usuário e com estado.

Implementação

As etapas a seguir explicam como funciona a pré-busca NoState.

  1. NoStatePrefetch é acionado.

    Uma dica de recurso de pré-renderização (por exemplo, <link rel="prerender">) e alguns recursos do Chrome vão acionar a pré-busca do NoState, desde que as duas condições a seguir sejam atendidas: a) o usuário não esteja em um dispositivo simples e b) o usuário não esteja em uma rede celular.

  2. Um novo renderizador dedicado é criado para a NoState Prefetch.

    No Chrome, um renderizador é um processo responsável por pegar um documento HTML, analisá-lo, construir a árvore de renderização e pintar o resultado na tela. Cada guia no Chrome, assim como cada processo NoState Prefetch, tem o próprio renderizador para proporcionar isolamento. Isso ajuda a minimizar os efeitos de algo errado (por exemplo, uma falha de guia) e impede que código malicioso acesse outras guias ou outras partes do sistema.

  3. O recurso que está sendo carregado com a pré-busca NoState é buscado. Em seguida, o HTMLPreloadScanner verifica esse recurso para descobrir quaisquer sub-recursos que precisem ser buscados. Se o recurso principal ou qualquer um dos sub-recursos dele tiver um service worker registrado, essas solicitações passarão pelo service worker adequado.

    A NoState Prefetch aceita apenas o método GET HTTP. Ela não buscará sub-recursos que exijam o uso de outros métodos HTTP. Além disso, ela não buscará recursos que exigem ações do usuário (por exemplo, pop-ups de autenticação, certificado do cliente SSL ou substituições manuais).

  4. Os sub-recursos buscados serão buscados com uma prioridade líquida "IDLE".

    A Prioridade líquida "IDLE" é a menor prioridade líquida possível no Chrome.

  5. Todos os recursos recuperados pela pré-busca NoState são armazenados em cache de acordo com os cabeçalhos do cache.

    A pré-busca NoState armazenará em cache todos os recursos, exceto aqueles com o cabeçalho no-store de controle de cache. Um recurso será revalidado antes do uso se houver um cabeçalho de resposta Vary, um cabeçalho de controle de cache no-cache ou se tiver mais de cinco minutos.

  6. O renderizador é eliminado depois que todos os sub-recursos são carregados.

    Se os sub-recursos atingirem o tempo limite, o renderizador será eliminado após 30 segundos.

  7. O navegador não faz modificações de estado, além de atualizar o armazenamento de cookies e o cache do DNS local. É importante chamar a atenção para isso porque se trata do “NoState” em “NoState Prefetch”.

    Neste ponto do processo "normal" de carregamento de página, o navegador provavelmente modificaria o estado dele: por exemplo, executar JavaScript, modificar sessionStorage ou localStorage, tocar músicas ou vídeos, usar a API History ou enviar solicitações ao usuário. As únicas modificações de estado que ocorrem na pré-busca NoState são a atualização do cache do DNS quando as respostas chegam e a atualização do armazenamento de cookies se uma resposta contiver o cabeçalho Set-Cookie.

  8. Quando o recurso é necessário, ele é carregado na janela do navegador.

    No entanto, ao contrário de uma página pré-renderizada, ela não fica visível imediatamente. Ela ainda precisa ser renderizada pelo navegador. O navegador não vai reutilizar o renderizador usado na pré-busca NoState e, em vez disso, usará um novo. Não renderizar a página com antecedência reduz o consumo de memória do NoStatePrefetch, mas também diminui o possível impacto que ele pode ter nos tempos de carregamento da página.

    Se a página tiver um service worker, esse carregamento de página passará por ele novamente.

    Se a NoState Prefetch não concluir a busca de sub-recursos no momento em que a página for necessária, o navegador continuará com o processo de carregamento de onde a NoState Prefetch parou. O navegador ainda precisará buscar recursos, mas não tantos quanto seria necessário se NoState Prefetch não tivesse sido iniciado.

Impacto na análise da Web

As páginas carregadas com o NoState Prefetch são registradas pelas ferramentas de análise da Web em momentos ligeiramente diferentes, dependendo se a ferramenta coleta dados no lado do cliente ou no lado do servidor.

Os scripts de análise do lado do cliente registram uma visualização de página quando a página é mostrada ao usuário. Esses scripts dependem da execução de JavaScript, e a NoState Prefetch não executa nenhum JavaScript.

As ferramentas de análise do lado do servidor registram métricas quando uma solicitação é processada. Para recursos carregados pelo NoState Prefetch, pode haver um intervalo de tempo significativo entre o processamento de uma solicitação e o momento em que a resposta é realmente usada pelo cliente, caso ela seja usada. Desde o Chrome 69, a NoState Prefetch adiciona o cabeçalho Purpose: Prefetch a todas as solicitações para diferenciá-las da navegação normal.

Confira agora

NoStatePrefetch lançado em dezembro de 2017 no Chrome 63. No momento, ele é usado para:

  • Implementar a dica de recurso prerender
  • Buscar o primeiro resultado na Pesquisa Google
  • Busca as páginas que a barra de endereço do Chrome prevê que provavelmente serão visitadas em seguida.

Você pode usar a interface interna do Chrome para ver como tem usado o NoStatePrefetch.

Para conferir a lista de sites que foram carregados com a NoState Prefetch, acesse chrome://net-internals/#prerender.

Para conferir as estatísticas do seu uso da NoState Prefetch, acesse chrome://histograms e pesquise "NoStatePrefetch". Há três histogramas diferentes de NoState Prefetch, um para cada caso de uso:

  • "NoStatePrefetch" (estatísticas de uso por dicas de recursos pré-renderizadas)
  • “gws_NoStatePrefetch” (estatísticas de uso pela página de resultados de pesquisa do Google)
  • "omnibox_NoStatePrefetch" (estatísticas de uso pela barra de endereço do Chrome)