Descubra como o carregamento mais rápido de recursos de terceiros pode aumentar a receita.
Este estudo de caso destaca como melhorar a performance dos recursos de terceiros pode aumentar as métricas de negócios. Enquanto um estudo anterior mediu o custo da latência de anúncios adicionada, este estudo demonstra o valor de uma melhoria de desempenho real:
0,5%
Aumento da receita para editores
2%
Aumento nos carregamentos iniciais de scripts de anúncios
Fonte: dados internos do Google, junho a julho de 2019.
Contexto
A Tag do editor do Google (GPT) é o script de inclusão de tags do Google Ad Manager que solicita e exibe anúncios de display na Web. Ao implementar um cabeçalho HTTP stale-while-revalidate
simples para o GPT, a equipe do GPT conseguiu melhorar a velocidade e o desempenho dos anúncios de display do Google para os parceiros editores. Essa mesma técnica pode ser aplicada a qualquer outro cenário em que carregar scripts o mais rápido possível é mais importante do que carregar o código mais recente.
O problema
A GPT é implantada como um script de bootstrapping, gpt.js
, que recebe um curto time to live (TTL) de 15 minutos. Esse TTL curto permite que o script seja atualizado ou revertido rapidamente. Depois de carregado, gpt.js
solicita e carrega scripts de implementação adicionais, que têm um TTL mais longo.
Quando o TTL de 15 minutos expirar, a versão de gpt.js
no cache vai ficar desatualizada e precisará ser revalidada. Antes, esse processo de revalidação envolvia uma solicitação de rede síncrona para buscar uma nova cópia do script, o que adicionava latência à primeira solicitação de anúncio.
A solução
O atributo stale-while-revalidate
é usado pelo cabeçalho Cache-Control
e define uma janela de tempo extra em que um cache pode usar um recurso desatualizado enquanto ele é revalidado de forma assíncrona. Isso ajuda os desenvolvedores a equilibrar a rapidez, ou seja, o carregamento imediato do conteúdo armazenado em cache, e a atualização, garantindo que as atualizações do conteúdo armazenado em cache sejam usadas no futuro.
Estudo de caso dos anúncios de display do Google
A equipe do GPT adicionou esse cabeçalho Cache-Control
na resposta HTTP gpt.js
em 2016, antecipando a implementação de stale-while-revalidate
pelos navegadores:
cache-control: private, max-age=900, stale-while-revalidate=3600
Essa configuração significa que, se gpt.js
for solicitado entre 15 e 60 minutos após o valor anterior em cache, o valor em cache será usado para atender à solicitação, mesmo que esteja desatualizado. Ao mesmo tempo, uma solicitação de nova validação será feita em segundo plano para preencher o cache com um valor atualizado para uso futuro.
O Chrome lançou a stale-while-revalidate
na versão 75 para 99% de todo o tráfego, deixando 1% do tráfego com o recurso desativado temporariamente para medir o impacto. A equipe do GPT registrou as métricas desse 1% (o grupo experimental) e uma amostra de 1% do tráfego com o recurso ativado (o grupo de controle) para testar a eficácia de stale-while-revalidate
em scripts de anúncios. Ao longo de duas semanas de métricas registradas com base em um tamanho de amostra de 5,2 bilhões de impressões de anúncios de display do Google, o grupo de controle observou:
- Aumento de 0,3% nas impressões de anúncios.
- Aumento de 0,5% na receita.
- Aumento de 2% nos carregamentos iniciais de scripts de anúncios (menos de 500 ms a partir do início do carregamento da página).
- Aumento de 1,1% no número de carregamentos de script de anúncio bem-sucedidos.
Como mostrado no gráfico acima, os resultados desse experimento podem ser atribuídos a um aumento nos carregamentos bem-sucedidos de scripts de anúncios, com a maioria ocorrendo no início do processo de carregamento da página.
Implementar a validação parcial no seu site
A equipe do GPT percebeu que fazer uma mudança relativamente simples nos cabeçalhos HTTP com stale-while-revalidate
pode melhorar a velocidade e aumentar as métricas comerciais. Confira a postagem Como manter as informações atualizadas usando obsoletos enquanto revalida (link em inglês) para saber mais sobre a implementação de stale-while-revalidate
no seu site.