jQuery delegate vs bind triggering (v20)

Revision 20 of this benchmark created on


Preparation HTML

<div id="extra-dom-content">
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
<a href="#">Home</a>
</div>
<a href="#">Home</a>
<ul id="nav">
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Blog</a></li>
</ul>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

Test runner

Ready to run.

Testing in
TestOps/sec
bind
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
$('#nav').delegate('click', function(e) {
    e.preventDefault();
});
 
ready
delegate
$('#nav').delegate('a', 'click', function(e) {
 e.preventDefault();
});
ready

Revisions

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