DOM Level 3 CustomEvent vs jQuery.trigger vs EventEmitter 3 (v4)

Revision 4 of this benchmark created on

Description

Trigger a custom event on an element/object and find which method is faster.

Preparation HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://pastebin.com/raw.php?i=Wxqd8dvs"></script>
<script>
var jQueryListener = function(){/*Jquery Event terminates here*/};
var nativeListener = function(){/*Native CustomEvent terminates here*/};
</script>
<div id="target">A div</div>

Setup

$('#target').bind('jquery-test', jQueryListener);
    
    document.getElementById('target').addEventListener('native-test', nativeListener);
    
    var eventTarget = document.getElementById('target');
    var eventTargetJquery = $(eventTarget);
    var eventTargetEE = new EventEmitter();
    eventTargetEE.on('ee-test', function(){});

Teardown


    $('#target').unbind('jquery-test', jQueryListener);
    
    document.getElementById('target').removeEventListener('native-test', nativeListener);
    
    eventTargetEE.off('ee-test');

Test runner

Ready to run.

Testing in
TestOps/sec
DOM Level3 CustomEvent dispatched
var event = new CustomEvent('native-test');
eventTarget.dispatchEvent(event);
ready
jQuery .trigger(evt)
eventTargetJquery.trigger('jquery-test');
ready
EE
eventTargetEE.emit('ee-test');
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.