jQuery .delegate() vs .live() table test

JavaScript performance comparison

Revision 10 of this test case created by

Preparation code

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>


<table>
  <tbody>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
  </tbody>
</table>

<table>
  <tbody>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
  </tbody>
</table>

<table>
  <tbody>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
    <tr>
      <td><a href="/#"></a></td>
    </tr>
  </tbody>
</table>
    

Preparation code output

<table> <tbody> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> </tbody> </table> <table> <tbody> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> </tbody> </table> <table> <tbody> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> <tr> <td><a href="/#"></a></td> </tr> </tbody> </table>

Test runner

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

Java applet disabled.

Testing in CCBot 2.0.0 / Other 0.0.0
Test Ops/sec
.delegate()
$("table").delegate("td", "hover", function(){
    $(this).toggleClass("hover");
});
pending…
.live()
$("table").each(function(){
	$("td", this).live("hover", function(){
		$(this).toggleClass("hover");
	});
});
pending…
delegate from body
$(document.body).delegate("td", "hover", function(){
    $(this).toggleClass("hover");
});
pending…
delegate from body 2
$(document.body).delegate("table > tbody > td", "hover", function(){
    $(this).toggleClass("hover");
});
pending…
delegate from body 3
$(document.body).delegate("a[href='/#']", "hover", function(){
    $(this).toggleClass("hover");
});
pending…
delegate from body 4
$(document.body).delegate("a", "hover", function(){
    if ($(this).attr('href').indexOf('/#') === 0) {
       $(this).toggleClass("hover");
    }
});
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.

0 Comments