Cross browser event

JavaScript performance comparison

Revision 5 of this test case created by tiffon

Info

Creating a single event that is re-used for each test loop iteration.

Preparation code

<script type="text/javascript">

window.pseudoEvt = document.createEvent('MouseEvents');
window.pseudoEvt.initEvent('click', true, true);
window.makeEvt = function() {
  return window.pseudoEvt;
}
</script>
<div id="testDiv">
  &nbsp;
</div>
<script>
Benchmark.prototype.setup = function() {
    window.input = document.getElementById('testDiv');
    window.addHandlers = [
        function() { input.addEventListener('click', testTypeof, false); },
        function() { input.addEventListener('click', testBooleanOutput, false); },
        function() { input.addEventListener('click', testInline, false); },
        function() { input.addEventListener('click', testSwitch, false); }
    ];
    window.removeHandlers = [
        function() { input.removeEventListener('click', testTypeof, false); },
        function() { input.removeEventListener('click', testBooleanOutput, false); },
        function() { input.removeEventListener('click', testInline, false); },
        function() { input.removeEventListener('click', testSwitch, false); }
    ];
   
    for (var i = 0; i < 4; i++) {
        ui.benchmarks[i].setup = window.addHandlers[i];
        ui.benchmarks[i].teardown = window.removeHandlers[i];
    }
   
    window.testTypeof = function(e) {
      if (typeof e === 'object') {
        return e.target;
      }
      return window.event.srcElement;
    }
   
    window.testBooleanOutput = function(e) {
      e = e || window.event;
      return e.target || e.srcElement;
    }
   
    window.testInline = function(e) {
      return e ? e.target : window.event.srcElement;
    }
   
    window.testBooleanIO = function(e) {
      if (!e) {
        e = window.event;
      }
      var output = e.target || e.srcElement;
      return output;
    }
   
    window.testSwitch = function(e) {
      var output;
      switch (typeof e) {
      case 'undefined':
        output = window.event.srcElement;
        break;
      case 'object':
        output = e.target;
        break;
      }
      return output;
    }
};
</script>

Preparation code output

 

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
testTypeof
input.dispatchEvent(makeEvt());
pending…
testBooleanOutput
input.dispatchEvent(makeEvt());
pending…
testInline
input.dispatchEvent(makeEvt());
pending…
testBooleanIO
input.dispatchEvent(makeEvt());
pending…
testSwitch
input.dispatchEvent(makeEvt());
pending…

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:

0 comments

Add a comment