Greasemonkey Script: jQuery AJAX Latency Display

Displays the time between two AJAX calls that were made through any jQuery function. It binds to ajaxStart() and ajaxStop(), so jQuery is used and required.

We use it for a manual UI tests where time is an acceptance criteria.

(function() {

// ==UserScript==
// @name           jQuery AJAX Latency Display
// @description    Shows the time between ajaxStart() and ajaxStop(), jQuery is Required
// @author         Johannes Hoppe
// ==/UserScript==

  var insertScriptContent = "\
    var stopwatch;\
    \
    $(\"#latencyDisplay\").ajaxStart(function () {\
      stopwatch = new Date();\
      $(this).html(\"\");\
    });\
    \
    $(\"#latencyDisplay\").ajaxStop(function () {\
      elapsedTimeInSeconds = (new Date() - stopwatch) / 1000;\
      $(this).html(\"AJAX Timer: \" + elapsedTimeInSeconds + \"s\");\
    });"

  var insertDiv = document.createElement("div");
  insertDiv.id = "latencyDisplay";
  document.body.appendChild(insertDiv);

  var insertScript = document.createElement("script");
  insertScript.type = "text/javascript";
  insertScript.text = insertScriptContent;
  document.getElementsByTagName("head")[0].appendChild(insertScript);

})();

You can download and install this little Greasemonkey Script at http://userscripts.org/scripts/show/98208