live vs delegate vs on (v2)

Revision 2 of this benchmark created on

Preparation HTML

<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.min.js"></script>

Setup

var html = '<div id="test_el"><a href="http://example.com">Example</a></div>';

Test runner

Ready to run.

Testing in
TestOps/sec
.live()
$(function() {
  $('a').live('click', function() {
  
  });

  $('body').append(html);
});
ready
.delegate() on container
$(function() {
  $('div').delegate('a', 'click', function() {
  
  });

  $('body').append(html);
});
ready
.delegate() on body
$(function() {
  $('body').delegate('a', 'click', function() {
  
  });

  $('body').append(html);
});
ready
.on() on container
$(function() {
  $('div').on('click', 'a', function() {
  
  });

  $('body').append(html);
});
ready
.on() on body
$(function() {
  $('body').on('click', 'a', function() {
  
  });

  $('body').append(html);
});
ready
.on() on #test_el
$(function() {
  $('#test_el').on('click', 'a', function() {
  
  });

  $('body').append(html);
});
ready

Revisions

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