Melhore a velocidade do site com auditorias de anúncios do editor para Lighthouse

Publicados: 2020-06-05
Melhore a velocidade do site com auditorias de anúncios do editor para Lighthouse

Esta postagem foi atualizada pela última vez em 6 de setembro de 2021

Houve um aumento nas solicitações dos editores em relação à velocidade de carregamento de suas páginas e ao comportamento geral de seus sites. Na postagem de hoje, veremos algumas das perguntas que os editores têm levantado e, posteriormente, mostraremos como fazer seus próprios relatórios e avaliar melhor a situação de carregamento da página.

#1 – O site carrega devagar e tem pontuação baixa nas ferramentas de relatórios

É importante entender que o comportamento final de um site é resultado devários fatores : tecnologia utilizada para construir a página, quantos elementos são mostrados no site, como esses elementos são armazenados, cálculos feitos em tempo de execução, etc. Ferramentas de relatórios ( como LightHouse, que discutiremos mais tarde) identificará essas questões.Observe que esses problemas não estão relacionados ao nosso código, pois são uma consequência de como o site é construído.

#2 – O código do MonetizeMore deixou o site lento

Quanto maior o número de blocos de anúncios em uma página, mais elementos precisam ser carregados, portanto, sempre há umacompensação entre a velocidade da página e a receita que precisa ser considerada.Os editores precisam estar cientes disso o tempo todo. Nosso código não impacta significativamente no desempenho do site.O script de anúncio MonetizeMore é executado de forma assíncrona , o que significa que, enquanto o processo de lance de cabeçalho está em execução, o restante do site continua a carregar como faria sem nosso código.Ao executar o lance de cabeçalho, é inevitável que o script de carregamento do anúncio atrase a renderização do anúncio até que o tempo limite do lance seja atingido, outra compensação que precisa ser abordada. O tempo limite padrão recomendado é de 2.000 ms para atingir um equilíbrio saudável entre a velocidade de carregamento da página e as boas taxas de preenchimento do Header Bidding. Diminuir esse tempo limite pode ajudar a reduzir o tempo de carregamento, apenas se a página estiver carregando mais rápido do que o tempo limite definido. A redução do tempo limite de lances de cabeçalho aumenta as chances de o leilão de lances de cabeçalho terminar antes que todos os licitantes configurados retornem seus lances finais.

Farol

Usaremos as auditorias de anúncios do editor para o Lighthouse no futuro, e você pode encontrá-las aqui: https://developers.google.com/publisher-ads-audits

Embora nosso script possa não ser o principal culpado no desempenho da página, o desempenho da página afeta o tráfego e, portanto, torna-se uma questão importante para nós. Faça sua própria avaliação do site e tente abordar as sugestões/advertências.

Com cromo:

1.- Abra a página de destino

2.- Clique com o botão direito do mouse e selecione Inspecionar

Clique com o botão direito do mouse e selecione Inspecionar

3.- Entre as ferramentas de desenvolvimento, procure a última, chamada Audits

Auditorias de anúncios para Lighthouse

4.- Selecione as categorias relevantes e clique em “Gerar relatório”. Após várias atualizações do site, um relatório será gerado e exibido.

captura de tela do farol

Serão mostradas várias categorias nas quais a página foi avaliada:

  • Desempenho: execução técnica da página, que inclui interatividade, velocidade e codificação.
  • Acessibilidade: elementos de design que permitem que pessoas com deficiências específicas se envolvam com o conteúdo de maneira mais confortável
  • Boas Práticas: recomendações gerais, principalmente para melhorar a navegação e a segurança
  • SEO: otimizações para os buscadores interagirem com o site
  • Progressive Web App: PWA é um tipo específico de site que se assemelha muito a um aplicativo móvel, na apresentação e sob o capô. Aqui estão sugestões de otimização para este tipo de site.

A maioria dessas informações é bastante direta. Um que devemos prestar bastante atenção é o performance -> Diagnostics, onde podemos ver o desempenho dos códigos js, e em particular, o nosso.

diagnóstico

Na figura acima (Diagnóstico -> Reduzir o impacto do código de terceiros), vemos que nosso código bloqueia menos de um terço de segundo na thread principal (a thread responsável por carregar a página). Nenhum desses códigos está bloqueando muito o thread principal, mas todo o grupo de códigos de terceiros usa um segundo inteiro do thread principal, que é basicamente o que os usuários experimentam.

tempo de execução do javascript

Na figura acima (Diagnóstico -> Reduzir o tempo de execução do JavaScript), vemos que nosso código está alinhado com o restante dos códigos em tempo de execução. Mesmo que o tempo de execução tenha sido maior, isso está sendo feito em outro thread de forma assíncrona, portanto, não afeta o desempenho.

Considerações

  • Você pode realizar um teste simples, executando este relatório sem nossas tags e, em seguida, adicionar nossas tags e executar o relatório novamente. Conforme mencionado, compensações farão com que a pontuação total caia, mas isso é esperado.
  • A maioria dos testes/pontuações de velocidade da página não considera o atraso necessário ao executar lances de cabeçalho e são projetados para avaliar tags de anúncio codificadas. Portanto, ao executar em uma página com o lance de cabeçalho ativo, eles não levarão em consideração a funcionalidade personalizada e reduzirão a pontuação para ela.
  • Seus próprios plug-ins do Chrome podem alterar muito o desempenho do próprio relatório. Você pode tentar testar a página em um ambiente mais limpo:
    • Vá para a seguinte página: https://developers.google.com/publisher-ads-audits.
    • Cole o endereço do site
    • Em Configurações avançadas, ative Executar auditorias adicionais do Lighthouse.
    • Clique em Gerar Relatório
    • *Este relatório também fornecerá o relatório Anúncios do editor. Se o site estiver configurado corretamente, a pontuação deve ser alta, portanto, pode ser uma boa maneira de mostrar aos editores que qualquer problema de desempenho provavelmente está em outro lugar
  • Se melhorar o desempenho é uma obrigação, você pode considerar:
    • Reduzindo o número de blocos de anúncios em uma página
    • Movendo a chamada de script MonetizeMore para o final da página ou mais acima, com base na implementação de outras chamadas pesadas de recursos/JS
    • Reduza o tempo limite de licitação do cabeçalho para um valor em que não haja perda significativa de licitações recebidas (pode ser testado via PGAI: na guia licitantes, código de cores das licitações recebidas)
    • Carregamento preguiçoso de todas as posições de anúncios em todas as páginas. (Ative o SPA no dbAdmin e alterne os DIVs para o formato lento)

Outras sugestões mais técnicas podem ser:

  • Melhore a carga do JavaScript: uma única chamada para um script pesado ou muitas chamadas para pequenos scripts afetarão negativamente o desempenho. Encontre um equilíbrio entre tarefas e chamadas em JS. Isso só pode ser feito com arquivos JS que o pub pode manipular (não nosso wrapper, GA ou script do Facebook, por exemplo)
  • Certifique-se de que qualquer script que possa ser executado de forma assíncrona o faça. Nosso script já faz
  • Certifique-se de que os recursos (imagens, vídeos) sejam codificados com as tecnologias mais recentes. Isso permite que os elementos sejam compactados enquanto viajam e descompactados quando carregados na página.

Precisa de mais ajuda? Inscreva-se para uma conta profissional na MonetizeMore hoje!