2

I'm chasing page speed, partly as proof that getting 90%+ is consistently achievable.

My main issue now is Google Analytics. In the below example, it's loaded via Google Tag Manager, so there's just the one GTM snippet at the top of the screen - however page speed insights appears to state that it's GA (and GTM) causing the largest delay.

Is there a way to prevent GA from slowing page load? Should the GTM script be set as async (given that we may miss some analytics data)?


sp

1

I would definitely reccommend loading GTM async, chances are it would be loaded in less than a second anyway, so you won't miss many is any events. In Googles analytics documentation, they recommend loading it async. I think tag manager is the same. On my site I have it loading async, and it works fine, I get page load events fine.

  • Interestingly, GA has an async snippet and GTM has an non-async... – RemarkLima Dec 13 '19 at 16:58
1

I disagree with Conors answer.

Let's compare these two methods: For GTM you need in the head-tag

<!-- Google Tag Manager (noscript) --> <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX"height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript><!-- End Google Tag Manager (noscript) -->    

and in body-tag

<script async>(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-XXXXXXX');</script>    

Use "async" to load that script (Google doesn't tell you)

For Analytics.js you only need in the body-tag

<!-- Global site tag (gtag.js) - Google Analytics --><script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXX-X"></script><script>window.dataLayer=window.dataLayer || []; function gtag(){dataLayer.push(arguments);}gtag('js', new Date()); gtag('config', 'UA-56544056-1');</script>    

"async" here as well increases the performance.

Now test both options with Google Pagespeed Insight and the results will be better if you choose the second method. It's confusing, because the first method results in less traffic from Javascript, what should give you more points in Pagespeed Insight. Considering that and the fact that Google is pushing GTM, I guess the lower result by choosing the first method is unintended by Google. But there are other tools to measure page performance...

I'm wondering if other users can confirm this finding.

Cheers, Mathias

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.