Using Asynchronous Tracking in Google Analytics

In the last little bit I’ve managed to write a few articles about web analytics and more importantly Google Analytics. Like most web analytics tracking software, Google Analytics uses what is known as a “tracking pixel” also known as a “tracking code”. Recently they’ve added some functionality to help you with web page load times. Now you might ask “Why is this important to me?” and the truth is that it’s very important if you value gaining more and more visitors to your website. By and large, most people that are out there browsing the web don’t like to spend a lot of time finding your web page. On average most people will not wait that long for a website to load before they decide to leave.Back in 2006, Akamai and JupiterResearch said that the acceptable wait time for a web page to respond and load shouldn’t exceed 4 seconds.

Now keep in mind that this was three years ago and today, with advances with web technologies I am sure that 4 second wait time is way too long today. With the advent of AJAX (Asynchronous JavaScript and XML) it’s possible to optimize website to improve these wait times.

How AJAX works and why is it important to asynchronous web analytics tracking

The big point to understand about AJAX is that it uses JavaScript and XML to load the web page all at once, one time only. In classic HTML and CSS every time a web page is loaded because a call must be made to a web server to retrieve the web page. Think about any time you’ve refreshed a web page each one of those is a new instance of a web page created once the web page is reloaded. Using AJAX, only the information that has changed on the web page is reloaded not the web page itself. That is the important lesson here.

Source: Interakt

Now think, if you have the traditional GA.js tracking code from Google Analytics on your web page then that means that every time you load a new instance of a web page in your website the GA.js tracking code needs to be reloaded as well and this increases that web page load time. This is one reason why more and more people are using AJAX technology in their website today including the Google Analytics Development Team. Some of the big benefits of the asynchronous javascript tracking code as stated by the Google Analytics team are…

• 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

Source: Google Analytics Blog

How easy is it to add the Asynchronous Tracking Code to your website?

Now the part that you’ve all been waiting for… how easy is it to add this to your website? The answer, it’s really very easy! Let me show you just how easy it is:

1. Get this piece of code…

<script type=”text/javascript”>

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXX-X']);
_gaq.push(['_trackPageview']);

(function() {
var ga = document.createElement(’script’);
ga.src = (’https:’ == document.location.protocol ? ‘https://ssl’ : ‘http://www’) + ‘.google-analytics.com/ga.js’;
ga.setAttribute(’async’, ‘true’);
document.documentElement.firstChild.appendChild(ga);
})();

</script>

Click here to get it!

2. Replace the ‘UA-XXXXX-X’ with the web property ID from your Google Analytics account

3. Add it the same way you added the original GATC (Google Analytics Tracking Code)

4. You are all done!

Before you install: Now if you already have Google Analytics Tracking Code in place on your website you are going to need to remove it first and then add the Asynchronous Tracking Code to your website.

Even if you are a beginner with web analytics or you are trying to understand how to use it for your business incorporating AJAX technology into your website to improve the overall user experience will only help improve the performance of your website and understand how people use your website.

“Asynchronously” yours,

Luc Arnold