Front End Performance Monitoring

feature_tracking.js

TrackTiming = function(category, feature) {
  this.category = category;
  this.feature = feature;
  this.startTime = new Date().getTime();
  this.endTime = null;
  return this;
};

TrackTiming.prototype.startTime = new Date().getTime(); // shared startTime

TrackTiming.prototype.setEnd = function() {
  this.endTime = new Date().getTime();
  return this;
};

TrackTiming.prototype.sendFeatureTiming = function() {
  var time = this.endTime - this.startTime;
  var twoMinutes = 1000 * 60 * 2;
  if (time < twoMinutes && time > 0) {
    window._gaq.push(['_trackTiming',
    this.category, this.feature, time]);
  }
  return this;
};

var tt = new TrackTiming(); // init
$(‘#myImg’).on('load', function() {
  tt.setEndTime().sendFeatureTiming();
}); 

page_tracking.js

TrackTiming.prototype.sendFeatureTiming = function() {
  var time = this.endTime - this.startTime;
  var twoMinutes = 1000 * 60 * 2;
  if (time < twoMinutes && time > 0) {
    window._gaq.push(['_trackTiming',
    this.category, this.feature, time]);
  }
  return this;
};

var tt = new TrackTiming(); // init
$(‘#myImg’).on('load', function() {
  tt.setEndTime().sendFeatureTiming();
}); 

unresponsive_tracking.js

var measurements = [];
var now = new Date();

var checkTime = function(measurements) {
  var newNow = new Date();
  
  measurements.push(newNow - now);
  now = newNow;
  setTimeout(checkTime,300);
};

// collects an array of times:
// measurements = [357,300,300,424,404,300]