PageSpeed OptiPic - optimización automática del sitio para los requisitos de Google Pagespeed Insights
JavaScript: Fusión, compresión, carga perezosa. CSS: compresión de tamaño y optimización de carga. Optimización de imágenes. Optimización de widgets de terceros y sistemas de análisis.

¿Cómo evitar problemas relacionados con Google Tag Manager en la velocidad de la página para mejorar el rendimiento?

Tenemos un sitio web oficial de la empresa. Cuando verificamos la velocidad de la página, el sitio tiene una calificación baja y muestra el script de Google Tag Manager en "Reducir JavaScript no utilizado". Como Google Tag Manager es importante para el sitio web, ¿hay alguna forma de solucionar este problema? El atributo 'defer' no funciona con el script.

#1

Google Tag Manager es, por definición, un impedimento para el rendimiento. Su único propósito es permitir que personas no técnicas eliminen basura aleatoria muy importante scripts de terceros en un sitio web. Si evita GTM insertando directamente las etiquetas / scripts externos que desea en su sitio, mejorará el rendimiento de inmediato.

Si no puede hacer eso, aún puede optimizar la forma en que se carga GTM, no es cierto que no se pueda aplazar. Esta es la implementación predeterminada de GTM:

<!-- Google Tag Manager --> <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-XXXX');</script> <!-- End Google Tag Manager --> 

Ahora no puede simplemente poner el atributo defer en la etiqueta de script ya que eso no funciona en scripts en línea. Pero si observa detenidamente lo que hace el script, verá que simplemente inserta otro elemento de script que carga gtm.js desde los servidores de Google. Incluso es asíncrono de forma predeterminada, vea esta línea j.async=true. Si cambia eso a j.defer=true, gtm.js se cargará aplazado. Tenga en cuenta que algunos scripts / etiquetas insertados por GTM pueden no esperar esto, por lo que podría romper algo de una manera inesperada.

Además de eso, hay algunos ajustes menores que puede hacer, pero no podrá evitar el hecho de que GTM es una biblioteca innecesaria y enorme que afectará el rendimiento de la página. En una escala deslizante de conveniencia a rendimiento, GTM está completamente en el lado de la conveniencia. Si tiene que justificar el bajo rendimiento, muestre a su cliente el resultado de la prueba y dígales que elijan uno.

#2

Puedes agregar precarga de la biblioteca GTM en la etiqueta.

<link href="https://www.googletagmanager.com/gtag/js?id=mygtmid" rel="preload" as="script"> 

También puedes agregar DNS-prefetch

<link rel="dns-prefetch" href="https://www.googletagmanager.com/"> 

además, puedes optimizar cuidadosamente tu GTM.

  1. eliminando etiquetas innecesarias de GTM
  2. Puedes optimizar tus códigos javascript inyectados desde GTM
#3

¿Has PROBADO colocar scripts en la página en lugar de dentro del contenedor GTM?

Porque yo lo he probado con hasta 40 scripts, y la mejora es prácticamente nula.

?