Mejorar el tiempo de carga del código de Google Analytics

¿Sabías que existen tres tipos de códigos de Google Analytics y que el que usa Google por defecto es el más lento? Te voy a mostrar cómo mejorar el tiempo de carga del código de Google Analytics.

Recientemente cambié el código que usaba de Analytics, el que se usa por defecto (gtag.js) por el antiguo (analytics.js).

Si esta bien, no es la decisión existencial más importante que he tomado en mi vida, pero hay una razón que para mi es más que suficiente para darle vueltas a algo tan específico, lo hice para mejorar el tiempo de carga del sitio sin sacrificar las funcionalidades que preciso.

Google analytics usa actualmente el código gtag.js para obtener datos de análisis desde tu sitio web, pero no es la única opción.

¿Cuál es la diferencia entre ga.js, analytics.js, gtag.js?

Básicamente, la diferencia que hay entre estos tres archivos es las funcionalidades que soportan.

Para poder elegir qué código usar, te tienes que hacer la pregunta; ¿Qué tipos de datos quiero recopilar?

Si sólo quieres medir el tráfico de tu sitio web y usar solamente la herramienta de Google Analytics, entonces no uses el nuevo código porque va a comprometer la velocidad de tu web sin necesidad. En¿n su lugar usa el código analytics.js.

Las diferencias entre ga.js, analytics.js y gtag.js son:

ga.js (sin soporte, el más liviano)

Es el el primer código usado desde el 2009, tiene la menor cantidad de características y ya no cuenta con soporte. Debido a esto no se recomienda su uso, aunque puedes usarlo si no necesitas de todas las características que ofrecen la siguientes actualizaciones.

Si quieres usar el código de Analytics más liviano y por tanto más rápido para tu web, este es el ideal.

analytics.js (recomendado y liviano)

Tiene un uso extendido en Internet desde su primera aparición en 2013, y agrega un montón de características en comparación con su predecesor.

Soporta todas las características que se necesitan en Google analytics y actualmente continúa siendo mantenido por Google con mejoras.

Es el código que recomiendo implementar en la mayoría de los casos.

gtag.js (más completo y pesado)

gtag.js nace en 2017 con la idea de unificar todas las plataformas de Google, como Google Ads, Campaign Manager o Google Analytics.

Es similar a analytics.js, pero facilita la integración con otras plataformas de Google.

Si vas a usar por ejemplo Google Ads entonces es necesario agregar el código gtag.js.

Si estás buscando obtener un 100/100 en Google Speed Test o en Pingdom Tools no uses esta etiqueta de código, ¿porqué?:

  1. El navegador no carga el código en caché como si lo hace con el anterior.
  2. El peso total es de 90KB, ~60KB del archivo gtag.js y 30KB del archivo analytics.js, estarías agregando ~60KB a la carga de tu web que seguramente no son necesarios.

Código analytics.js

Copia el siguiente código en tu sitio web, lo más «abajo» posible, es decir lo más cerca posible de la etiqueta HTML </body>. Esto es para que la carga del código no comprometa la velocidad de carga de la página web.

<!-- Google Analytics -->
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<script async src='https://www.google-analytics.com/analytics.js'></script>
<!-- End Google Analytics -->

Sustituye el código UA-XXXXX-Y con el correspondiente al ID de tu usuario.

Nota: Si no sabes el ID de tu cuenta, puedes usar esta herramienta de Google. O, si estás familiarizado con Google Analytics > Administrar > Propiedad (con la cuenta seleccionada) > Información de seguimiento > Código de seguimiento.

Resumen

Te expliqué las diferencias entre los tres códigos de Google Analytics; ga.js, analytics.js y gtag.js. Además te di algunas razones por las que usar el código analytics.js por sobre los otros.

Comparte: Te gusto o te ha parecido útil este artículo? Considera compartirlo con tus amigos, me será de gran ayuda para seguir creciendo.

TwitterFacebookBufferLinkedInWhatsAppPin It

Deja un comentario