Skip to content

Instantly share code, notes, and snippets.

@thomaspuppe
Created November 2, 2012 11:49
Show Gist options
  • Save thomaspuppe/4000626 to your computer and use it in GitHub Desktop.
Save thomaspuppe/4000626 to your computer and use it in GitHub Desktop.
Track Navigation Timing data from the Browser in Google Analytics
var NAMESPACE = NAMESPACE || {};
NAMESPACE.gaSpeedTrackingJsLoadStart = (new Date()).getTime();
/* All JS ... */
/* Encapsulate "use strict" to this part of the code, while others can still be unstrict. */
(function () {
"use strict";
/* Track JS Parsing time (start was set at the Beginning of the JS) */
NAMESPACE.gaSpeedTrackingJsLoadEnd = (new Date()).getTime();
if (parseInt(NAMESPACE.gaSpeedTrackingJsLoadStart,10)>0 && parseInt(NAMESPACE.gaSpeedTrackingJsLoadEnd,10)>0) {
NAMESPACE.gaSpeedTrackingJsLoadDuration = parseInt(NAMESPACE.gaSpeedTrackingJsLoadEnd,10) - parseInt(NAMESPACE.gaSpeedTrackingJsLoadStart,10);
// 0-60000: prevent ridiculous numbers from false calculation
if (NAMESPACE.gaSpeedTrackingJsLoadDuration>0 && NAMESPACE.gaSpeedTrackingJsLoadDuration<60000) {
var _gaq = window._gaq || [];
_gaq.push(['_trackTiming', 'Navigation Timing', 'JavaScript Parsing', NAMESPACE.gaSpeedTrackingJsLoadDuration]);
}
}
/* Calculate and track Browser's Performance Timing */
NAMESPACE.getNavigationTimingStats = function () {
var timing = window.performance.timing;
return {
dns:timing.domainLookupEnd - timing.domainLookupStart,
connect:timing.connectEnd - timing.connectStart,
ttfb:timing.responseStart - timing.connectEnd,
basePage:timing.responseEnd - timing.responseStart,
frontEnd:timing.loadEventStart - timing.responseEnd,
domContentLoadedEvent:timing.domContentLoadedEventEnd - timing.domContentLoadedEventStart,
windowLoadEvent:timing.loadEventEnd - timing.loadEventStart,
domInteractive:timing.domInteractive - timing.domLoading,
domComplete:timing.domComplete - timing.domLoading,
domCompleteToOnload: timing.loadEventStart - timing.domComplete
};
};
NAMESPACE.trackNavigationTiming = function () {
if (window.performance && window.performance.timing) {
var _gaq = window._gaq || [];
var ntStats = NAMESPACE.getNavigationTimingStats();
// 0-60000: prevent ridiculous numbers from false calculation
if (ntStats.dns > 0 && ntStats.dns < 60000) {
_gaq.push(['_trackTiming', 'Navigation Timing', 'DNS', ntStats.dns]);
}
if (ntStats.connect > 0 && ntStats.connect < 60000) {
_gaq.push(['_trackTiming', 'Navigation Timing', 'Connect', ntStats.connect]);
}
if (ntStats.ttfb > 0 && ntStats.ttfb < 60000) {
_gaq.push(['_trackTiming', 'Navigation Timing', 'TTFB', ntStats.ttfb]);
}
if (ntStats.basePage > 0 && ntStats.basePage < 60000) {
_gaq.push(['_trackTiming', 'Navigation Timing', 'BasePage', ntStats.basePage]);
}
if (ntStats.frontEnd > 0 && ntStats.frontEnd < 60000) {
_gaq.push(['_trackTiming', 'Navigation Timing', 'FrontEnd', ntStats.frontEnd]);
}
if (ntStats.domContentLoadedEvent > 0 && ntStats.domContentLoadedEvent < 60000) {
_gaq.push(['_trackTiming', 'Navigation Timing', 'domReady Events', ntStats.domContentLoadedEvent]);
}
if (ntStats.windowLoadEvent > 0 && ntStats.windowLoadEvent < 60000) {
_gaq.push(['_trackTiming', 'Navigation Timing', 'windowLoad Events', ntStats.windowLoadEvent]);
}
if (ntStats.domInteractive > 0 && ntStats.domInteractive < 60000) {
_gaq.push(['_trackTiming', 'Navigation Timing', 'domInteractive', ntStats.domInteractive]);
}
if (ntStats.domComplete > 0 && ntStats.domComplete < 60000) {
_gaq.push(['_trackTiming', 'Navigation Timing', 'domComplete', ntStats.domComplete]);
}
if (ntStats.domCompleteToOnload > 0 && ntStats.domCompleteToOnload < 60000) {
_gaq.push(['_trackTiming', 'Navigation Timing', 'domCompleteToOnload', ntStats.domCompleteToOnload]);
}
}
};
$(window).load(function () {
"use strict";
NAMESPACE.trackNavigationTiming();
});
}());
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment