Recording request page time with google analytics

Question

It's easy enough to record how long a page takes to load using Events with Google Analytics and I can find plenty of examples of how to do that by searching. The problem is most of these methods record the start time as being the moment the page starts to load so in effect all it tells you is how long the page took to render in a browser. I want to time the full page lifecycle, ie from when the request begins until the browser has completely rendered the page to the user.

Anyone know how to do that with GA?

Is there any way to get from the browser when the request started, rather than having to record a timestamp in javascript?

Answer 1

What you're looking for isn't a special GA feature; This can be done with the arrangements you cited you've found, but the difference is, you want to start the counter earlier.

There are two basic options: Either when the request is received by your server (in your case, use a server-side timestamp at the beginning of processing. (The potential hazard here is comparing server-side timestamps with client-side timestamps, which could introduce discrepancies depending on the end-user's clock.)

Or, more appealingly, start the clock when the user makes the request on the client-side, so, anytime anyone clicks an internal link on your site, store the current timestamp in a cookie, and then when the following page is done loading, make a GA event call using the difference in the value of the cookie and getTime() of the onload time as your 'page load' time; then destroy the cookie.

This can be done fairly trivially with jQuery; the pure javascript is a bit more complciated.

Using this jQuery plugin, you can add some like the following event binding, which will cookie the timestamp every time someone clicks a non-external link:

$("a").not( $("a[href^=http://]")).click( function() {
var clicktime = new Date();
$.cookie("request_begin", clicktime.getTime(), {domain: 'example.com', path: '/' });
});

You'd retrieve the value on the following page using

start_time = $.cookie("request_begin");

And then destroy the cookie by doing

$.cookie("request_begin", null, {domain: 'example.com', path: '/' });