The following post will provide detailed information about gtag.js Vs analtytics.js.  Recently google analytics changed tracking snipped from universal analytics (analytics.js) to global site tag (gtag.js).  According to google this change will provide a framework for streamlined web page tagging and provide better control of data while implementation will become a lot easier.  That simply means Google wants to make website tagging (script implementation) simpler to non-technical users.

Tracking script of gtag.js is quite simple as we compare it with analytics.js but it serves the greater purpose of behavior analysis of website visitors.

Since gtag.js snipped introduced into google analytics, users have the curiosity to know more about gtag.js or global site tag.  I have written a detailed post what is global site tag (gtag.js) about this topic.

Peoples are also wanting to know what is the difference between gtag.js and analytics.js? Should they migrate to gtag.js? If gtag.js is better then why? In this post, you will answer all above questions.

Should migrate to gtag.js?

Global site tag (gtag.js) is a beta launch that means developers are Google is still working on this tracking code. For now, it is not a final product and some changes may be possible in future. So if you have a new website with low traffic volume then you can migrate to gtag.js.

But, migration to gtag.js is NOT recommended to an old website with a high volume of traffic because it will be difficult to make any further changes which will come with full version of global site tag (gtag.js).

gtag.js Vs analytics.js

1) Tracking Code:  JavaScript tracking snipped of both gtag.js and analytics.js need to place inside <head> of every page of the website. But, gtag.js has less code complicity.

analytics.js

Tracking script is quite complicated and can work only for google analytics tracking.

The above-given code has four main parts

  • <script> part of code starts asynchronously downloading the analytics.js JavaScript library from https://www.google-analytics.com/analytics.js
  • Initializes a global ga function (called the ga() command queue) that allows you to schedule commands to be run once the analytics.js library is loaded and ready to go.
  • Adds a command to the ga() command queue to create a new tracker object for the property specified via the ‘UA-XXXXX-Y’ parameter.
  • Adds another command to the ga() command queue to send a pageview to Google Analytics for the current page.

gtag.js

Tracking snipped a lot simpler and can work for Google firebase, conversion tracking.

The given global site tag code mainly serves two purposes

  • It configures the Google Analytics property with the tracking ID GA_TRACKING_ID as the default property to receive data sent by the event command.
  • It sends a pageview to the default property.

2)Sending Data to google analytics:  Both tracking methods of google analytics uses different methods to send data to google analytics.

Universal analytics (analytics.js) tracking code use the  send  a command  given at last line of tracking code to the ga() command queue to send a pageview to Google Analytics

Global site tag (gtag.js) use the event command to send data to google analytics report.  Let’s take an example where we want to record user login event in google analytics then following event command will be used.

The event command has the following syntax:

3)Track pageviews:

Page tracking allows the website owner to measure a number of views for each page of the website.

Track pageviews with analytics.js: Universal tracking (analytics.js) uses trackers to send pageviews to Google Analytics and tracker has the tracking ID of a Google Analytics property.  analytics.js uses send command to track pageviews of any particular page. Pageview hits can be sent using the send command and specifying a hitType of pageview. The send command has the following signature for the pageview hit type:

Track pageviews with gtag.js: Global site tag (gtag.js) sends pageviews to a Google Analytics property identified by the GA_TRACKING_ID specified in a config command.

For tracking of pageviews of specified tracker replace following analytics.js code with given gtag.js code.

with the following gtag.js event command:

4)Track events:

Events are users action or interaction with content of a website which can to track with the help of google analytics.

Event tracking with analytics.js: Universal tracking analytics.js uses trackers to send events to Google Analytics. A tracker has the tracking ID of a Google Analytics property.

Event Tracking with gtag.js: Global site tag, gtag.js sends events to a Google Analytics property identified by the GA_TRACKING_ID specified in a config command.

where eventName is the name of the event you want to log.

5)Send custom dimensions and metrics

With the help of this feature of google analytics, a user can send custom data to google analytics. Both types of tracking allow custom dimensions and metrics but syntax to code for both (gtag.js and analytics.js) is different.

analytics.js:  Universal tracking uses to send a command to custom dimensions and metrics.

For custom dimension

for custom metrics

gtag.js: Global site tag uses event command with config for custom dimensions and metrics.

For custom dimension

For custom metrics

6)Track user timings:  It is well known that websites with less load time provide better user experience. Google analytics provides several reports which automatically measures page load time. Google analytics allows tracking custom timing information as well.

User timings allow developers to measure periods of time using the analytics.js library.

Track user timing with analytics.js: In universal analytics user timing can be easily tracked with the help of send command and specify a hitType of timing.

Track user timing with gtag.js: gtag.js uses a simple way to track user timing as it sends a timing_complete event with the help of event command.

7)Track exceptions:  With the help of Exception tracking user can track number and type of crashes or errors that occur on your property.

Exception tracking with analytics.js: To track exception analytics.js uses send command and specifying a hitType of exception. Syntax of exception tracking is given below

Exception tracking with gtag.js:  following tracking code can be used to track exception with global site tag (gtag.js)

8)Cookies and user ID:  To determine that two different hits came from the same user, google analytics associated a unique identifier with a particular user that must be sent with each hit by the user.

Both gtag.js and analytics.js tracking methods use same _ga cookie for user identification.

Analytics.js

Following default cookies are and default values are used by analytics.js.

Field Name                                                                                       Value Type          Default value

cookieName                                                                                                     text             _ga

cookieDomain                                                                                                  text         The result of the following JavaScript expression:

document.location.hostname

cookieExpires                                                                           integer         63072000 (two years, in seconds)

You can modify given default value by using following code snippet.

Gtag.js

Following cookies with given default values are used by gtag.js for user identification.

Field name                                                                                                         Value type           Default value

cookie_name                                                                                                   string      _ga

cookie_domain                                                                                                string      auto

cookie_expires                                                                                                integer  63072000 (two years, in seconds)

You can make changes in default values of cookies by using given code

10)IP anonymization:  In some cases, you might want to anonymize the IP address of hit sent to google analytics. IP anonymization is possible with both gtag.js and analytics.js but methods and syntax is different.

Analytics.js

To anonymize the IP address for all hits sent from a single tracker, use the set command to set the anonymizeIp field to true on the tracker:

Gtag.js

To anonymize the IP address for all events, update the config for your property by setting the value of the anonymize_ip parameter to true:

11)Enhanced link attribution: Both types of google analytics tracking are supporting enhanced link attribution. Enhanced link attribution basically improves the accuracy of data sent to google analytics report by automatically differentiating between multiple links to the same URL on a single page by using link element IDs.

Analytics.js

Enhanced link attribution will be shown in google analytics admin UI

You need to update tracking code need to add given the code on every page of the website.

gtag.js

Enhanced link attribution will be shown in google analytics admin UI

Update tracking code and add ‘link_attribution’: true on every page of website

12)Single page application tracking:  Single page applications (SPA) are single page websites or web applications where all the resources load on the single page. When a user clicks on links and interacts with the page, the content of page loaded dynamically without changing its URL. Tracking of this type websites can be done with virtual pageviews tracking. Both, type of analytics tracking supports virtual pageviews tracking.

Virtual Pageview tracking with analytics.js:  To track virtual pageviews, use the send command to update tracker and supply new page value.

Virtual Pageview tracking with gtag.js:  To track virtual pageviews with global site tag (gtag.js), update the config section of tracking code for your web property and specify the value of page_path parameter

13)Limits and Quotas:  Google analytics is used by all small and medium websites. But, google analytics system can handle the limited amount of data that’s why google analytics applied some limitation for accurate and smooth reporting of data.

Limitations of both gtag.js and analytics.js are same, limitations are given below

  1. 10 million hits per month per property
  2. 500 hits per session
  3. 200,000 hits per user per day
  4. Each ga.js tracker object starts with 10 hits that are replenished at a rate of 1 hit per second.
  5. Each analytics.js tracker object starts with 20 hits that are replenished at a rate of 2 hit per second

Conclusion:  I have given detailed information about gtag.js Vs analytics.js or global site tag Vs universal analytics. Gtag.js can track all type activities which can be tracked by analytics.js, in addition, it can perform some extra task as well. Global site tag (gtag.js) will be used to add some advance report in google analytics admin UI in future.