.parents vs new query

JavaScript performance comparison

Test case created by Josh Farneman

Info

Is someVar.parents('ul') faster than $('ul')?

Preparation code

 <div class="header clearfix" id="top">
    <h1>
      <a href="/"><img src="/img/Outlanders-logo.png" width="348" height="250" alt="Huntley Ritter's Outlanders Limited Draw" /></a>
    </h1>

    <div class="nav" id="secondary">
      <ul>
       
       
       
       
        <li>
          <a href="#email-sign-up" class="modal">Email Sign-Up</a>
        </li>
        <li class="social">
          <a href="http://twitter.com/Huntley_Ritter" title="Outlanders on Twitter">
            <img src="/img/twitter-icon.png" width="27" height="26" alt="Twitter" />
          </a>
        </li>
        <li class="social">
          <a href="https://www.facebook.com/outlanderstv" title="Outlanders on Facebook">
            <img src="/img/facebook-icon.png" width="27" height="26" alt="Facebook" />
          </a>
        </li>
      </ul>
    </div> <!-- end #secondary -->

    <div class="nav my-nav" id="primary">
      <ul>
        <li >
          <a href="/show">Show</a>
        </li>
        <li >
          <a href="/enter-the-draw">The Draw</a>
        </li>
        <li >
          <a href="/video">Video</a>
        </li>
        <li >
          <a href="/gallery">Gallery</a>
        </li>
        <li class="active">
          <a href="/gear">Gear</a>
        </li>
        <li >
          <a href="/blog">Blog</a>
        </li>
        <li >
          <a href="/community">Community</a>
        </li>
      </ul>
    </div> <!-- end #primary -->
  </div> <!-- end #top -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
 
<script>
Benchmark.prototype.setup = function() {
    $someVar = $('.my-nav a');
};
</script>

Preparation code output

Test runner

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

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
.parents()
var $newVar = $someVar.parents('ul');
pending…
$()
var $newVar = $('.my-nav');
pending…

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

Compare results of other browsers

0 comments

Add a comment