Back to Code List
javascript

Timing Details Plugin

This plugin allows you to capture various timing points to use for various analytics. This is useful for finding how long your web pages take to load on average so you can improve the pages that really count. Please see the tooltips file for more information below.

For more information about the browser timing, you can visit this link: W3C Navigation Timing

   tooltips.txt

Timing Details

Mini Description:
    This extension gathers information about timing on the page from the moment the user hits enter on the url bar.

Additional Extension Info:
    This extension gathers information about timing on the page from the moment the user hits enter on the url bar. After the page is fully loaded, there are key data points available so you can see how long pages take to load. This extension outputs 5 variables from the previous page load:
        _timing_url: the url associated with the timing details. This outputs the previous page's information to track in something like SiteCatalyst.
        _timing_domain_lookup: the first data point from the moment the user initiates a page request until the actual domain request (after redirects and caching).
        _timing_start_dom: the next data point - until the dom starts loading.
        _timing_end_dom: the next data point - until the dom is done loading.
        _timing_end_load: the last data point - the page is completely loaded.    

   code_to_paste.js

//only set this to "view" for the plugin to load
//this plugin should only be ran on a page load
var a = "view";

//the output variable. After the function runs,
//use the data in here as you require
var b = {};

(function (a,b,c,e,g,q,r,t,v,u,k) {
    // only do on page loads
    if (a == "view") {
        r = function (w, x, y, z) {
            // read cookie
            x = w + "=";
            y = document.cookie.split(';');
            for (var i = 0; i < y.length; i++) {
                z = y[i];
                while (z.charAt(0) == ' ')
                    z = z.substring(1, z.length);
                if (z.indexOf(x) == 0)
                    return z.substring(x.length, z.length);
            }
            return "";
        };
        q = function (x, y, z, Z) {
            // set cookie
            var Z = new Date();
            if (z) Z.setTime(Z.getTime()+(z*1000));
            document.cookie = x + "=" + y + ";path=/;domain=" + location.hostname + ";expires=" + (z?z.toGMTString():"");
        };
        e = function(element, event, fn) {
            // event listener attaching
            if (element.addEventListener)
                element.addEventListener(event, fn, false);
            else if (element.attachEvent)
                element.attachEvent('on' + event, fn);
        }
        g = function(number) {
            // lookup for bucket a number fits in
            if (number < 25) return "0-25ms";
            if (number < 50) return "25-50ms";
            if (number < 100) return "50-100ms";
            if (number < 150) return "100-150ms";
            if (number < 250) return "150-250ms";
            if (number < 500) return "250-500ms";
            if (number < 750) return "500-750ms";
            if (number < 1000) return "750ms-1s";
            if (number < 1500) return "1-1.5s";
            if (number < 2000) return "1.5-2s";
            if (number < 3000) return "2-3s";
            return ">3s";
        }
        v = function() {
            // make sure performance.timing exists so we can use it
            if (performance && performance.timing) {
                t = performance.timing;
                q("_t_url",document.URL,30*60);
                q("_t_dp1",g(t.domainLookupStart-t.navigationStart),30*60);
                q("_t_dp2",g(t.domLoading-t.navigationStart),30*60);
                q("_t_dp3",g(t.domComplete-t.navigationStart),30*60);
                q("_t_dp4",g(t.loadEventEnd-t.navigationStart),30*60);
            } else {
                console.log("timing stats not available");
            }
        };
        
        // insert previous page values into udo
        if (r("_timing_url")) {
            b('_timing_url') = r("_t_url");
            b('_timing_domain_lookup') = r("_t_dp1");
            b('_timing_start_dom') = r("_t_dp2");
            b('_timing_end_dom') = r("_t_dp3");
            b('_timing_end_load') = r("_t_dp4");
            
            //delete cookie values as to not falsely report elsewhere
            q('_t_url',"",1);
            for(i=1;i<5;i++) {
                q('_t_dp'+i,"",1);
            }
        }
        
        // check to see if already loaded
        if (document.readyState != "complete") {
            // write values after page has completely loaded
            e(window, 'load', v);
        } else {
            // already loaded, so just set the cookies
            v();
        }
    }
})(a,b);