jQuery Selector Perf - Right-to-Left (v106)

Revision 106 of this benchmark created by Reith on

Description

See http://jsperf.com/jquery-selector-perf-right-to-left or scroll down.

Preparation HTML

<h1>jQuery Selector Perf - Right-to-Left</h1>
        <h2>JavaScript performance comparison</h2>
</hgroup>
<p class="nmeta">Test case created by <a href="//net.tutsplus.com" rel="nofollow">Jeffrey Way</a> <time datetime="2011-02-02T23:54:33+01:00" pubdate="">on 2nd February 2011</time></p>
<section id="nprep-code">
<h2>Preparation code</h2>
<pre><code><span class="nsc2">&lt;<span class="nkw2">div</span> <span class="nkw3">id</span><span class="nsy0">=</span><span class="nst0">"box"</span>&gt;</span><br>&nbsp; <span class="nsc2">&lt;<span class="nkw2">p</span>&gt;</span> Hi <span class="nsc2">&lt;<span class="nsy0">/</span><span class="nkw2">p</span>&gt;</span><br><span class="nsc2">&lt;<span class="nsy0">/</span><span class="nkw2">div</span>&gt;</span><br>&nbsp; <span class="nsc2">&lt;<span class="nkw2">script</span> <span class="nkw3">src</span><span class="nsy0">=</span><span class="nst0">"//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"</span>&gt;</span><span class="nsc2">&lt;<span class="nsy0">/</span><span class="nkw2">script</span>&gt;</span></code></pre>
</section>
<section>
<h2>Preparation code output</h2>
<div class="nuser-output">
<div id="nbox">
  <p> Hi </p>
</div>
  </div>
</section>
<section id="nrunner">
<h2>Test runner</h2>
<p id="nfirebug"><strong>Warning! For accurate results, please disable Firebug before running the tests. <a href="/faq#firebug-warning">(Why?)</a></strong></p>
<p id="njava"><strong>Java applet disabled.</strong></p>
<p id="nstatus">Done. Ready to run again.</p>
<div class="nshow" id="ncontrols"><button id="nrun" type="button">Run again</button></div>
<table id="ntest-table">
        <caption>Testing in <span id="nuser-agent">Firefox 18.0 on Linux 64-bit</span></caption>
        <thead>
                <tr>
                        <th colspan="2">Test</th>
                        <th title="Operations per second (higher is better)">Ops/sec</th>
                </tr>
        </thead>
        <tbody>
                <tr>
                        <th title="Click to run this test again." tabindex="0" scope="row" id="ntitle-1"><div>"Left to Write" Thinking</div></th>
                        <td class="ncode"><pre><code>$<span class="nbr0">(</span><span class="nst0">'#box p'</span><span class="nbr0">)</span><span class="nsy0">;</span></code></pre></td>
                        <td title="Ran 843 times in 0.051 seconds." id="nresults-1" class="nresults slowest">16,516 <small>±0.33%</small><span>29% slower</span></td>
                </tr>
                <tr>
                        <th title="Click to run this test again." tabindex="0" scope="row" id="ntitle-2"><div>"Right to Left"</div></th>
                        <td class="ncode"><pre><code>$<span class="nbr0">(</span><span class="nst0">'#box'</span><span class="nbr0">)</span>.<span class="nme1">children</span><span class="nbr0">(</span><span class="nst0">'p'</span><span class="nbr0">)</span><span class="nsy0">;</span></code></pre></td>
                        <td title="Ran 940 times in 0.052 seconds." id="nresults-2" class="nresults">17,955 <small>±1.38%</small><span>24% slower</span></td>
                </tr>
                <tr>
                        <th title="Click to run this test again." tabindex="0" scope="row" id="ntitle-3"><div>Alternate "Right to Left"</div></th>
                        <td class="ncode"><pre><code>$<span class="nbr0">(</span><span class="nst0">'#box'</span><span class="nbr0">)</span>.<span class="nme1">find</span><span class="nbr0">(</span><span class="nst0">'p'</span><span class="nbr0">)</span><span class="nsy0">;</span></code></pre></td>
                        <td title="Ran 1,405 times in 0.059 seconds." id="nresults-3" class="nresults fastest">23,710 <small>±2.05%</small><span>fastest</span></td>
                </tr>
        </tbody>
</table><div class="n" id="nerror-info"></div>
</section>
<section>
<h2 id="nresults">Compare results of other browsers</h2>
<p><span id="ncharts"><strong>Chart type:</strong> <a href="#">bar</a>, <a href="#">column</a>, <a href="#">line</a>, <a href="#">pie</a>, <a href="#">table</a></span><br><span id="nfilters"><strong>Filter:</strong> <a href="#">popular</a>, <a href="#">all</a>, <a href="#">desktop</a>, <a href="#">family</a>, <a href="#">major</a>, <a href="#">minor</a>, <a href="#">mobile</a>, <a href="#">prerelease</a>
<h2>Revisions</h2>
<p>You can <a href="/jquery-selector-perf-right-to-left/edit" rel="nofollow">edit these tests or add even more tests to this page</a> by appending <code>/edit</code> to the URL. Here’s a list of current revisions for this page:</p>
<ul>
        <li class="ncurrent"><a href="/jquery-selector-perf-right-to-left">Revision 1</a>: published by Jeffrey Way <time datetime="2011-02-02T23:54:33+01:00" pubdate="">on 2nd February 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/32">Revision 32</a>: published <time datetime="2011-02-16T17:17:57+01:00" pubdate="">on 16th February 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/37">Revision 37</a>: published <time datetime="2011-03-12T23:37:09+01:00" pubdate="">on 12th March 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/38">Revision 38</a>: published <time datetime="2011-03-12T23:37:40+01:00" pubdate="">on 12th March 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/40">Revision 40</a>: published <time datetime="2011-03-24T22:50:29+01:00" pubdate="">on 24th March 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/41">Revision 41</a>: published <time datetime="2011-03-24T22:54:25+01:00" pubdate="">on 24th March 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/44">Revision 44</a>: published <time datetime="2011-05-04T14:32:37+02:00" pubdate="">on 4th May 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/45">Revision 45</a>: published <time datetime="2011-05-06T12:28:45+02:00" pubdate="">on 6th May 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/46">Revision 46</a>: published <time datetime="2011-05-12T01:24:57+02:00" pubdate="">on 12th May 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/47">Revision 47</a>: published <time datetime="2011-05-12T01:33:05+02:00" pubdate="">on 12th May 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/48">Revision 48</a>: published <time datetime="2011-05-17T17:38:33+02:00" pubdate="">on 17th May 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/49">Revision 49</a>: published <time datetime="2011-05-26T19:52:33+02:00" pubdate="">on 26th May 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/50">Revision 50</a>: published by ShiningRay <time datetime="2011-05-27T05:20:01+02:00" pubdate="">on 27th May 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/52">Revision 52</a>: published <time datetime="2011-06-10T17:34:09+02:00" pubdate="">on 10th June 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/54">Revision 54</a>: published <time datetime="2011-06-18T12:48:15+02:00" pubdate="">on 18th June 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/55">Revision 55</a>: published by tick <time datetime="2011-06-22T18:08:00+02:00" pubdate="">on 22nd June 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/56">Revision 56</a>: published <time datetime="2011-09-01T22:58:13+02:00" pubdate="">on 1st September 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/57">Revision 57</a>: published <time datetime="2011-09-01T23:11:13+02:00" pubdate="">on 1st September 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/58">Revision 58</a>: published by MoonScript <time datetime="2011-09-02T17:51:56+02:00" pubdate="">on 2nd September 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/59">Revision 59</a>: published by richard <time datetime="2011-09-02T22:37:35+02:00" pubdate="">on 2nd September 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/60">Revision 60</a>: published <time datetime="2011-09-07T19:08:55+02:00" pubdate="">on 7th September 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/61">Revision 61</a>: published <time datetime="2011-09-07T19:12:56+02:00" pubdate="">on 7th September 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/62">Revision 62</a>: published <time datetime="2011-09-07T19:15:49+02:00" pubdate="">on 7th September 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/63">Revision 63</a>: published <time datetime="2011-09-07T19:22:08+02:00" pubdate="">on 7th September 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/64">Revision 64</a>: published <time datetime="2011-09-07T19:24:12+02:00" pubdate="">on 7th September 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/65">Revision 65</a>: published <time datetime="2011-10-18T15:48:47+02:00" pubdate="">on 18th October 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/68">Revision 68</a>: published by m--s <time datetime="2011-11-28T13:56:08+01:00" pubdate="">on 28th November 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/69">Revision 69</a>: published by devu <time datetime="2011-11-29T01:14:21+01:00" pubdate="">on 29th November 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/70">Revision 70</a>: published by Scott Kosman <time datetime="2011-12-13T09:40:26+01:00" pubdate="">on 13th December 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/71">Revision 71</a>: published <time datetime="2011-12-16T14:49:07+01:00" pubdate="">on 16th December 2011</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/74">Revision 74</a>: published <time datetime="2012-01-19T12:32:30+01:00" pubdate="">on 19th January 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/75">Revision 75</a>: published <time datetime="2012-01-19T12:40:38+01:00" pubdate="">on 19th January 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/83">Revision 83</a>: published <time datetime="2012-02-22T15:29:24+01:00" pubdate="">on 22nd February 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/84">Revision 84</a>: published <time datetime="2012-03-06T01:04:11+01:00" pubdate="">on 6th March 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/87">Revision 87</a>: published <time datetime="2012-03-08T22:11:40+01:00" pubdate="">on 8th March 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/88">Revision 88</a>: published by Chris Miller <time datetime="2012-04-18T09:23:39+02:00" pubdate="">on 18th April 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/89">Revision 89</a>: published by Chris Miller <time datetime="2012-04-18T09:26:35+02:00" pubdate="">on 18th April 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/90">Revision 90</a>: published by Chris Miller <time datetime="2012-04-18T09:27:19+02:00" pubdate="">on 18th April 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/91">Revision 91</a>: published <time datetime="2012-05-02T01:21:38+02:00" pubdate="">on 2nd May 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/92">Revision 92</a>: published by Dominik Nejdl <time datetime="2012-05-14T23:55:28+02:00" pubdate="">on 14th May 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/93">Revision 93</a>: published <time datetime="2012-05-23T10:26:19+02:00" pubdate="">on 23rd May 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/94">Revision 94</a>: published <time datetime="2012-05-31T15:09:50+02:00" pubdate="">on 31st May 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/95">Revision 95</a>: published by Marco Pfeiffer <time datetime="2012-05-31T22:30:40+02:00" pubdate="">on 31st May 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/97">Revision 97</a>: published <time datetime="2012-09-27T17:22:07+02:00" pubdate="">on 27th September 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/98">Revision 98</a>: published <time datetime="2012-09-30T19:20:23+02:00" pubdate="">on 30th September 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/99">Revision 99</a>: published <time datetime="2012-09-30T19:21:25+02:00" pubdate="">on 30th September 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/101">Revision 101</a>: published <time datetime="2012-11-12T10:35:07+01:00" pubdate="">on 12th November 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/102">Revision 102</a>: published <time datetime="2012-11-16T17:27:09+01:00" pubdate="">on 16th November 2012</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/103">Revision 103</a>: published <time datetime="2013-01-26T19:04:15+01:00" pubdate="">1 week ago</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/104">Revision 104</a>: published by BinaryKitten <time datetime="2013-01-26T19:08:45+01:00" pubdate="">1 week ago</time></li>
        <li class="parent"><a href="/jquery-selector-perf-right-to-left/105">Revision 105</a>: published <time datetime="2013-02-01T20:54:51+01:00" pubdate="">4 days ago</time></li>
</ul>
</section>
<section id="ncomments"><h1>10 comments</h1><div id="ncomments-wrapper">
<article id="ncomment-1"><p class="nmeta"><img src="//gravatar.com/avatar/91f445313d631e0f89b671e16c6557f8?s=26" height="26" width="26"> Brad  commented <time datetime="2011-02-03T05:18:33+01:00" pubdate="">on 3rd February 2011</time>: <a href="#comment-1" title="Permanent link to this comment">∞</a></p><div><p>Jeffery, sometimes you amaze me.</p>
<p>The numbers for Opera are vastly different than firefox.  And also the speed of reading is reversed.  why is that?</p>
</div></article>
<article id="ncomment-2"><p class="nmeta"><img src="//gravatar.com/avatar/24e08a9ea84deb17ae121074d0f17125?s=26" height="26" width="26"> <a href="//mathiasbynens.be/">Mathias Bynens</a>  commented <time datetime="2011-02-03T16:39:30+01:00" pubdate="">on 3rd February 2011</time>: <a href="#comment-2" title="Permanent link to this comment">∞</a></p><div><p>You should note that <code>$<span class="nbr0">(</span><span class="nst0">'#box'</span><span class="nbr0">)</span>.<span class="nme1">children</span><span class="nbr0">(</span><span class="nst0">'p'</span><span class="nbr0">)</span><span class="nsy0">;</span></code> is equivalent to <code>$<span class="nbr0">(</span><span class="nst0">'#box &gt; p'</span><span class="nbr0">)</span></code>, not <code>$<span class="nbr0">(</span><span class="nst0">'#box p'</span><span class="nbr0">)</span></code>. You’re comparing snippets that perform different tasks.</p>
</div></article>
<article id="ncomment-3"><p class="nmeta"><img src="//gravatar.com/avatar/eb810fa396af0b832ec6121274fd067d?s=26" height="26" width="26"> <a href="//omarabid.com" rel="nofollow">Abid Omar</a>  commented <time datetime="2011-02-06T00:29:41+01:00" pubdate="">on 6th February 2011</time>: <a href="#comment-3" title="Permanent link to this comment">∞</a></p><div><p>I think you meant "Left to right" and not "Left to write"?</p>
</div></article>
<article id="ncomment-4"><p class="nmeta"><img src="//gravatar.com/avatar/bdfd3badb24cc4f0f1799a10b8bbefa3?s=26" height="26" width="26"> <a href="//salxo.com" rel="nofollow">Salxo</a>  commented <time datetime="2011-02-15T13:19:00+01:00" pubdate="">on 15th February 2011</time>: <a href="#comment-4" title="Permanent link to this comment">∞</a></p><div><p>Very interesting!</p>
</div></article>
<article id="ncomment-5"><p class="nmeta"><img src="//gravatar.com/avatar/b0301cd1f76405b09cfaaf096183a59c?s=26" height="26" width="26"> John  commented <time datetime="2011-02-16T17:36:50+01:00" pubdate="">on 16th February 2011</time>: <a href="#comment-5" title="Permanent link to this comment">∞</a></p><div><p>Have added a few additional tests under rev 32. This whole test is incredibly relevant, we've been discussing it at work lots recently.</p>
<p>jQuery ultimately boils most things like this down to find where possible, so that's going to usually be the best approach.</p>
</div></article>
<article id="ncomment-6"><p class="nmeta"><img src="//gravatar.com/avatar/1f9f59eaa60f04ea9278267b90b98f5c?s=26" height="26" width="26"> Ümit  commented <time datetime="2011-02-25T01:37:25+01:00" pubdate="">on 25th February 2011</time>: <a href="#comment-6" title="Permanent link to this comment">∞</a></p><div><p>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.</p>
</div></article>
<article id="ncomment-7"><p class="nmeta"><img src="//gravatar.com/avatar/c2a77a7cb6142ed6c11d0b76f22d6b19?s=26" height="26" width="26"> <a href="//www.templatebase.info/" rel="nofollow">templatebase</a>  commented <time datetime="2011-03-14T11:15:28+01:00" pubdate="">on 14th March 2011</time>: <a href="#comment-7" title="Permanent link to this comment">∞</a></p><div><p>Very interesting! I new in jquery it is good to know what is the fastest way to search tags :)  .</p>
<p>Thanks again</p>
</div></article>
<article id="ncomment-8"><p class="nmeta"><img src="//gravatar.com/avatar/04abfc833f2fe86927fc3a074ee2b30e?s=26" height="26" width="26"> <a href="//www.tdesignonline.com" rel="nofollow">richard lee</a>  commented <time datetime="2011-09-01T23:44:01+02:00" pubdate="">on 1st September 2011</time>: <a href="#comment-8" title="Permanent link to this comment">∞</a></p><div><p><a rel="nofollow" href="http://jsperf.com/predefined-vs-new-query/2">http://jsperf.com/predefined-vs-new-query/2</a></p>
<p>check that out.. (note the bottom 2 examples)</p>
</div></article>
<article id="ncomment-9"><p class="nmeta"><img src="//gravatar.com/avatar/04abfc833f2fe86927fc3a074ee2b30e?s=26" height="26" width="26"> <a href="//www.tdesignonline.com" rel="nofollow">richard</a>  commented <time datetime="2011-09-02T22:39:55+02:00" pubdate="">on 2nd September 2011</time>: <a href="#comment-9" title="Permanent link to this comment">∞</a></p><div><p>check that out (bottom)...  <a rel="nofollow" href="http://jsperf.com/jquery-selector-perf-right-to-left/59">http://jsperf.com/jquery-selector-perf-right-to-left/59</a></p>
<p>makes you wonder about how your user experience is affected.</p>
</div></article>
<article id="ncomment-10"><p class="nmeta"><img src="//gravatar.com/avatar/4b4360b4b0e026e8d973859d65893116?s=26" height="26" width="26"> <a href="//thoughtresults.com" rel="nofollow">Saeed Neamati</a>  commented <time datetime="2012-12-03T10:37:57+01:00" pubdate="">on 3rd December 2012</time>: <a href="#comment-10" title="Permanent link to this comment">∞</a></p><div><p>Great. I wish we could have a place to include all of these tips and tricks related to jQuery.</p>

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

Test runner

Ready to run.

Testing in
TestOps/sec
1. LTR
$('.parent > a');
ready
1. RTL
$('.parent').children('a');
ready
2. LTR
$('.parent a');
ready
2. RTL
$('.parent').find('a');
ready

Revisions

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