Google Tag manager impact in web performance (load time)

Viewed 8888

I´m trying to improve the load time and performance of my website. To summarize this is the average loading time stats that I get without including Google Tag Manager.

enter image description here

However when I just include Google Tag Manager with the code below which is just at the bottom of my page above the closing body tag, I can see a relevant impact in performance like:

enter image description here

<script async defer src="https://www.googletagmanager.com/gtag/js?id=myappid"></script>
    <script>
      var gaEnv;
      switch (window.location.hostname) {
        case 'production-domain':
            gaEnv = 'production-id'; // production
            break;
        default:
            gaEnv = 'development-id'; // development
      }
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
      // Config for analytics
      gtag('config', gaEnv, { 'send_page_view': false });
      // Config for Adwords   
      gtag('config', 'adwords-id');
    </script>

I have read a lot of blog posts about how to improve performance of these scripts y using async and defer attributes, but it´s pretty clear that these is still an important impact in performance (more than 2 secs in load time and 1sec in finish time).

Is there anything that I´m missing or can do?

2 Answers

Google tag manager adds performance bottlenecks to the site. Product managers like to have the GTM because of the workflow easiness when adding/updating/removing marketing and other javascript layers to the site.

The first thing you can do is preload the GTM library in the <head> tag.

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

You can also add dns-prefetch

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

The second and most important thing is not to mess the tags in GTM. You have to carefully craft the tags in the GTM.

Eg.

  • Remove unnecessary tags from GTM
  • Move the permanent tags which update rarely to the html code itself.
  • Optimize javascript codes injected from the GTM

If people are still looking for ways to improve GTM performance, there is this cool plugin called Partytown that puts your third party scripts in a web worker and removes the heavy load from your main thread. As a result it increases the performance by a lot.

Related