jQuery Selector Perf - Right-to-Left

JavaScript performance comparison

Test case created by Jeffrey Way

Preparation code

<div id="box">
  <p> Hi </p>
</div>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

Preparation code output

Hi

Test runner

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

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
"Left to Write" Thinking
 
$('#box p');
 pending…
"Right to Left"
 
$('#box').children('p');
 pending…
Alternate "Right to Left"
 
$('#box').find('p');
 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. Here’s a list of current revisions for this page:

10 comments

Brad commented : ∞

Jeffery, sometimes you amaze me.

The numbers for Opera are vastly different than firefox. And also the speed of reading is reversed. why is that?

Mathias Bynens commented : ∞

You should note that $('#box').children('p'); is equivalent to $('#box > p'), not $('#box p'). You’re comparing snippets that perform different tasks.

Abid Omar commented : ∞

I think you meant "Left to right" and not "Left to write"?

Salxo commented : ∞

Very interesting!

John commented : ∞

Have added a few additional tests under rev 32. This whole test is incredibly relevant, we've been discussing it at work lots recently.

jQuery ultimately boils most things like this down to find where possible, so that's going to usually be the best approach.

Ümit commented : ∞

I tested in Opera 11.01, IE 8.0 , Chrome 9.0.597.98, Safari 5.0.3 and Firefox 3.6.13. The results are showing same way except Opera.

templatebase commented : ∞

Very interesting! I new in jquery it is good to know what is the fastest way to search tags :) .

Thanks again

Saeed Neamati commented : ∞

Great. I wish we could have a place to include all of these tips and tricks related to jQuery.

Add a comment