jQuery Find Vs Sizzle (v4)

Revision 4 of this benchmark created on


Description

Testing some different methods of selecting elements in jQuery.

Preparation HTML

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

<div id="outer">
  <div id="inner">

  </div>
</div>

<div id="foo1">
  <div><div><div><div><div><div><div><div><div><div><div><div>
  <div><div><div><div><div><div><div><div><div><div><div><div>
  <div><div><div><div><div><div><div><div><div><div><div><div>
  <div class="baa"><div><div><div><div><div><div><div><div><div><div><div>
  <div id="foo2">
  </div>
  </div></div></div></div></div></div></div></div></div></div></div></div>
  </div></div></div></div></div></div></div></div></div></div></div></div>
  </div></div></div></div></div></div></div></div></div></div></div></div>
  </div></div></div></div></div></div></div></div></div></div></div></div>
</div>

Test runner

Ready to run.

Testing in
TestOps/sec
Sizzle
$('#outer #inner').html('finished');
ready
Find
$('#outer').find('#inner').html('finished');
ready
jQuery Find (ID)
jQuery('#foo1').find('#foo2')
ready
Sizzle (ID)
jQuery('#foo1 #foo2')
ready
jQuery Find (Class)
jQuery('#foo1').find('div.baa')
ready
Sizzle (Class)
jQuery('#foo1 div.baa')
ready

Revisions

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

  • Revision 1: published by Steven Hall on
  • Revision 2: published by Timmy Willison on
  • Revision 3: published by Adam Bankin on
  • Revision 4: published on
  • Revision 6: published on