Asynchronous Tracking Code Migration from ga.js.
Google introduced Asynchronous Tracking code for all users in the setup panel for the following reasons.
- Faster tracking code load times for your web pages due to improved browser execution
- Enhanced data collection and accuracy
- Elimination of tracking errors from dependencies when the JavaScript hasn’t fully loaded
The _gaq object is what makes the asynchronous syntax possible. It acts as a queue, which is a first-in,first-out data structure that collects API calls until ga.js is ready to execute them. To add something to the queue, use the _gaq.push method.
Asynchronous tracking code is in beta stage where we need to follow the steps to migrate from ga.js to the Asynchronous tracking
Step 1: Remove existing ga.js code and replacing with new asynchronous tracking code to reduce errors.
Step 2: Place the asynchronous tracking code starting of the tag. Whereas we have placed our ga.js code before tag.
Step 3: Modify _setAccount method with the web property ID [ UA-AAAAA-BB]
Step 4. Methods Migratiion:
Normally we use to track our pdf downloads, outgoing links from our site, events on the site etc.. will be customized using our ga.js which needs to be modify with the asynchronous tracking code. The following are some of the basic migration
_trackPageview Method Migration
Normal coding on ga.js- we have set our web property ID to pageTracker object and access the methods using that object called pageTracker
var pageTracker = _gat._getTracker(‘UA-XXXXX-X’);
pageTracker._trackPageview();
Equivalent code in asynchronous Syndax- Here we have create the object viz _gaq [ var _gaq = _gaq || []; ] then we set the Web Property ID to the _gaq object.
_gaq.push([‘_setAccount’, ‘UA-XXXXX-X’]);
_gaq.push([‘_trackPageview’]);
Multiple Tracking Object Migration:
If we need a two analytics account into a single Analytics code then we will create the pageTracker for the first Analytics account and the pageTrackerB is for the second one.
var pageTracker = _gat._getTracker(‘UA-XXXXX-1’);
pageTracker._trackPageview();
var pageTrackerB = _gat._getTracker(‘UA-XXXXX-2’);
pageTrackerB._trackPageview();
In our new method we use only gaq array for two account using the methods called _setAccount and b._setAccount.
_gaq.push([‘_setAccount’, ‘UA-XXXXX-1’]);
_gaq.push([‘_trackPageview’]);
_gaq.push([‘b._setAccount’, ‘UA-XXXXX-2’]);
_gaq.push([‘b._trackPageview’]);
_trackEvent Method Migration:
In ga.js method we use pageTracker object to access methods, here _trackEvent() method has been called using onclick event
var pageTracker = _gat._getTracker(‘UA-XXXXX-X’);
pageTracker._trackPageview();
…
<a onclick=”pageTracker._trackEvent(‘name’,value);”>click me</a>
In our new tracking code we need to use the _gaq method to call the _trackEvent method to enable the onclick event in the migration.
_gaq.push([‘_setAccount’, ‘UA-XXXXX-X’]);
_gaq.push([‘_trackPageview’]);
…
<a onclick=”_gaq.push([“_trackEvent”,’name’,value]);”>click me</a>
Follow the above said migration process to enjoy the new asynchronous tracking code for fast and accurate data collection for your site. For more information find our Google Analytics services page