jQuery VS Native API

JavaScript performance comparison

Test case created by cam song

Preparation code

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

<p id="bar" class="my-bar">
  Bar
</p>

<div id="coo" class="my-foo">
  <div id="car" class="my-bar">
    <div id="caz" class="my-bar">
<div id="hoo" class="my-boo">
  <div id="har" class="my-bar">
    <div id="haz" class="my-bar">
<div id="yoo" class="my-boo">
  <div id="yar" class="my-bar">
    <div id="yaz" class="my-bar">
<div id="zoo" class="my-boo">
  <div id="zar" class="my-bar">
    <div id="zaz" class="my-bar">

      <span id="baz" class="my-baz">Baz</span>

    </div>
  </div>
</div>
    </div>
  </div>
</div>
    </div>
  </div>
</div>
    </div>
  </div>
</div>

    

Preparation code output

<p id="bar" class="my-bar"> Bar </p> <div id="coo" class="my-foo"> <div id="car" class="my-bar"> <div id="caz" class="my-bar"> <div id="hoo" class="my-boo"> <div id="har" class="my-bar"> <div id="haz" class="my-bar"> <div id="yoo" class="my-boo"> <div id="yar" class="my-bar"> <div id="yaz" class="my-bar"> <div id="zoo" class="my-boo"> <div id="zar" class="my-bar"> <div id="zaz" class="my-bar"> <span id="baz" class="my-baz">Baz</span> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div>

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
document.getElementById
var els = document.getElementsByClassName("my-bar");
pending…
querySelector
var els = document.querySelectorAll(".my-bar");
pending…
jQuery
var els = $(".my-bar");
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

Bar

Baz