Google Analytics new migration to "Global site tag" using Google Tag manager confuses me a lot. It is Tag Manager, but it's not!?

The regular Google Tag Manager integration looks like this:

<!-- 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=
  '.js?id='+i+dl;f.parentNode.insertBefore(j,f);
  })(window,document,'script','dataLayer','GTM-XXXXXXX');
</script>

And the Google Analytics Global site tag integration like this:

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src=""></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'UA-XXXXXXXXX-X');
</script>

They load different resources. But both initiate the dataLayer push method. The way the object is created differs (supposing the two ways are interchangeable). Are we supposed to use both integrations side by side although the dataLayer object in one implementation conflicts the other?

On a side note. Both resources are bundled with jQuery 1.9.1. While it can't be optimal to load and instantiate jQuery twice, (or thrice if we have our own jQuery on top of this). Are there any workarounds or recommendations?

Google Analytics new migration to "Global site tag" using Google Tag manager confuses me a lot. It is Tag Manager, but it's not!?

The regular Google Tag Manager integration looks like this:

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

And the Google Analytics Global site tag integration like this:

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

They load different resources. But both initiate the dataLayer push method. The way the object is created differs (supposing the two ways are interchangeable). Are we supposed to use both integrations side by side although the dataLayer object in one implementation conflicts the other?

On a side note. Both resources are bundled with jQuery 1.9.1. While it can't be optimal to load and instantiate jQuery twice, (or thrice if we have our own jQuery on top of this). Are there any workarounds or recommendations?

• javascript
• jquery
• google-analytics
• google-tag-manager

• 4 GTM/Gtag are not bundled with jQuery. The GTM code has a built-in selector engine that resembles jQuery enough so that Google agreed to include jQuery's copyright notices, but it's not (even close to) a full jQuery library. This information comes from a Google Developer expert (Simo Ahava) so I trust that it's accurate. – Eike Pierstorff Commented Dec 22, 2017 at 8:53
• 1 It says jQuery 1.9.1 by jQuery Foundation in the source code. Have a quick look googletagmanager.com/gtag/js – tim Commented Dec 28, 2017 at 10:58
• I had a look a long time ago, which is why is I asked when I had the chance, The answer relayed in my comment is the one I got. – Eike Pierstorff Commented Dec 28, 2017 at 11:06
• It uses some code copied from jQuery 1.9.1, but doesn't include the whole thing as far as I can tell. – Collin Anderson Commented Oct 10, 2019 at 1:42

1 Answer 1

From the gtag.js Developer Guide:

If you are already using Tag Manager, you should continue to do so. If you don't need a tag management system, it is fine to use the gtag.js tracking codes provided by each product.

Tag Manager and gtag.js are built on the same infrastructure, and should work properly if deployed on the same page.

The Global Site Tag (gtag.js) is a new way of using analytics.js together with other Google products like AdWords or DoubleClick.
In fact, gtag.js loads up the same old analytics.js next to other libraries depending on what services you configure. In case you configure it with an AdWords account with gtag('config', 'AW-XXXXXXXX-X');, the script will automatically load up conversions.js too. Moreover, gtag.js also does some basic initialization of the services, e.g. triggers a pageview hit for Analytics or a remarketing hit for AdWords.

That being said, it is a bit like a tag manager indeed. However, it works only with Google products. So it is more of a simplification of configuration of the various Google tags by wrapping all of them into a single one.

It is important to note that if you are setting up a new Analytics account, you get the tracking code in the Global Site Tag format! You have no choice.

On the other hand, Google Tag Manager, like most tag management systems, enables you to manage tags beyond the Google suite of products. It comes with a user interface, version control, access management and all the other fancy things. Like analytics.js was, gtag.js is just another JavaScript library with which Tag Manager can communicate.