Como reduzir ficheiros JavaScript do GTM no PageSpeed Insights

Os ficheiros JavaScript (JS) do Google Tag Manager (GTM) são fundamentais para rastrear e analisar o comportamento dos visitantes do site. No entanto, o excesso de ficheiros JS pode afetar significativamente o desempenho e a funcionalidade do seu site.

Estes códigos JS tornam o carregamento do site mais lento, o que prejudica a experiência dos clientes. Além disso, sabia que um estudo da Amazon demonstra que cada 100 ms no tempo de carregamento da página custa 1% em receita? Por isso, reduzir os ficheiros JS é crucial para o seu site.

Neste artigo, apresentamos as soluções para reduzir o número de ficheiros JS do GTM, desde a auditoria de contentores até à mudança para o rastreio no lado do servidor.

A principal vantagem de otimizar os ficheiros JS no GTM é a melhoria significativa na velocidade de carregamento do site.

Cada ficheiro JS exige um pedido HTTP separado para carregar e, quanto mais ficheiros existirem, maior será o número de pedidos. Para os utilizadores, isto traduz-se em atrasos no carregamento do conteúdo do site, o que pode resultar numa taxa de rejeição mais elevada. Diretamente no seu site, pode levar a um pior posicionamento de SEO e a uma redução do tráfego.

Diminuir os ficheiros JS reduzirá o número de pedidos HTTP, tornando o carregamento do seu site mais rápido.

Os ficheiros do GTM surgem habitualmente nas seguintes secções dos relatórios do PageSpeed Insights:

• Reduzir o impacto do código de terceiros
• Reduzir o JavaScript não utilizado do Google Tag Manager

Clique na secção onde detetou problemas para aceder diretamente a ela.

O código JS de terceiros permite configurar o rastreio de diferentes ações dos utilizadores (cliques, deslocamento da página, partilha de conteúdo, etc.). No entanto, afeta a velocidade do site e torna-se frequentemente uma das maiores cargas na página web.

Para corrigir os ficheiros do GTM, recomendamos as seguintes soluções:

Reveja todas as etiquetas no seu contentor do GTM, pois algumas podem já não ser necessárias para a análise de desempenho do site. Este passo simples ajudará a reduzir o número de códigos de terceiros e a carga no seu site.

Para concluir esta tarefa, sugerimos a utilização do GTM.Tools. Aqui pode inspecionar o seu contentor, editar e atualizar em massa o conteúdo do Workspace.

As etiquetas HTML personalizadas são úteis para configurações de rastreio personalizadas; no entanto, são muitas vezes demasiado pesadas e, quando acionadas, afetam o tempo de carregamento do site. Reveja as etiquetas personalizadas que tem e tente mudar para os modelos do GTM, uma vez que são mais otimizados.

A CDN armazena em cache os dados do seu website e disponibiliza determinadas páginas a partir de um servidor mais próximo dos seus visitantes. Isto resulta num fornecimento mais rápido de ficheiros JS.

Algumas etiquetas não precisam de ser acionadas logo no carregamento da página. Configure o sequenciamento de etiquetas para etiquetas que podem ser adiadas. O sequenciamento de etiquetas permite-lhe especificar etiquetas para acionar imediatamente antes ou depois do acionamento de uma determinada etiqueta "primária". Para encontrar esta opção, aceda a “Advanced Settings” das etiquetas que pretende adiar.

Se reduzir as etiquetas de Custom HTML e/ou eliminar algumas etiquetas não funcionar no seu caso, aconselhamos que experimente o rastreio server-side. 

Como funciona? Ao mudar para server-side, transfere todas as etiquetas do GTM do contentor web para o contentor de servidor. Estas etiquetas serão carregadas no contentor de servidor em vez de serem carregadas nos navegadores dos utilizadores. Isto resultará num carregamento mais rápido do website.

O código JS não utilizado é o código que não é necessário para renderizar a página (para carregar e apresentar o conteúdo da página). Este código aumenta o tamanho do seu pacote JavaScript, resultando num carregamento mais lento do site.

A forma mais eficaz de resolver este problema é auditar o seu contentor do GTM e eliminar etiquetas desnecessárias.

No entanto, tenha em atenção que, muito provavelmente, não conseguirá excluir totalmente esses ficheiros JS desta secção no PageSpeed Insights. 

Alguns tipos de variáveis podem fazer parte do próprio GTM e são necessários para que o GTM funcione de forma geral. Tais variáveis incluem Auto Event Variable, DOM Element, Element Visibility, etc. Pode nem sequer adicionar estas variáveis no seu contentor, mas irá vê-las como "código JS não utilizado" no PageSpeed Insights.

Fazem parte da biblioteca do GTM e eliminá-las pode quebrar o código e fazer com que o GTM funcione incorretamente ou deixe de funcionar.

Porque é que aparece em "código JS não utilizado" se faz parte da biblioteca do GTM e é essencial para o funcionamento do GTM? O PageSpeed Insights marca-o como código não utilizado porque não tem esse tipo de variável no seu contentor. Está presente apenas na biblioteca do GTM.

Como pode verificar, o problema fundamental que pode enfrentar com os ficheiros JS do GTM está associado a contentores desorganizados e sobrecarregados. A solução essencial é monitorizar o tamanho do contentor e eliminar etiquetas desnecessárias atempadamente.

Existem duas formas de monitorizar o tamanho do contentor do GTM:

Adicione a extensão Get Google Tag Manager Size ao seu navegador e utilize-a no seu site quando quiser verificar.

A extensão irá mostrar-lhe o tamanho do contentor e fornecer detalhes sobre o número de variáveis, etiquetas e acionadores.

Utilize a ligação abaixo para verificar o tamanho do seu contentor do GTM. Em vez da parte "YOUR_ID" no URL, adicione o ID do seu contentor (clique em "Workspace" no GTM para ver o ID).

https://www.googletagmanager.com/gtag/js?id=YOUR_ID

Quando obtiver a página de resultados, copie e cole o conteúdo no TextEdit (para Mac OS) ou no Notepad (para Windows OS). Depois, poderá ver o tamanho deste ficheiro — esse é o tamanho do seu contentor do GTM.

Quando verificar o tamanho do contentor do GTM?

O tamanho limite do contentor é de 200 KB, mas o GTM alertará se atingir os 140 KB. Como é evidente, recomenda-se vivamente manter os contentores muito abaixo deste valor para não prejudicar o desempenho do website.

Sugerimos monitorizar periodicamente o tamanho do contentor, sobretudo após alterações substanciais e configurações de rastreio, de modo a controlar o impacto do código do GTM no desempenho do seu website.

O excesso de ficheiros JS do GTM pode prejudicar significativamente a pontuação de desempenho do seu website no PageSpeed Insights. Estes códigos tornam o carregamento mais lento, provocando uma taxa de rejeição mais elevada e um pior posicionamento nos motores de busca (SEO).

As formas mais eficazes de reduzir o número de ficheiros JS do GTM consistem em controlar o seu tamanho, auditar os contentores do GTM e eliminar etiquetas desnecessárias. No entanto, se a redução do número de etiquetas não surtir efeito, aconselhamos a considerar o rastreio no lado do servidor em vez do lado do cliente. Com o lado do servidor, todas as etiquetas do GTM serão carregadas no contentor do servidor em vez de no navegador, resultando num carregamento mais rápido do website.