click-perf (v4)

Revision 4 of this benchmark created by Bryan Rayner on

Preparation HTML

<div id="container"><div class="one"></div>
<div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div><div class="many"></div>
</div><script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

Test runner

Ready to run.

Testing in
TestOps/sec
one
$('.one').on('click', function() {});
ready
many
$('.many').on('click', function() {});
ready
parent bound
$('#container').on('click', '.many', function() {});
ready
'many' with DOM API
var els = document.querySelectorAll('.many');

var el, i = els.length;

function noop (){

};

while(i--){
   el = els[i];
   el.addEventListener('click', noop);
}
ready

Revisions

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