jQuery vs. document.querySelector (v73)

Revision 73 of this benchmark created on


Description

I know its been done before. Just want to see for myself

Preparation HTML

<div id="notmain"></div>
<div id="main">
  <div>Hello Dolly</div>
  <ul class="gallery">
    <li>
      Hello World
    </li>
    <li>
      Hello World
    </li>
    <li>
      Hello World
    </li>
    <li>
      Hello World
    </li>
    <li>
      Hello World
    </li>
    <li>
      Hello World
    </li>
  </ul>
</div>
<ul>
<li>Goodbye World</li>
</ul>
<script src="https://code.jquery.com/jquery-1.11.0.min.js"></script>

Teardown


    var el = document.querySelectorAll("li");
    for (var i = 0; i < el.length; i++) {
      el[i].style.display = "list-item";
    }
  

Test runner

Ready to run.

Testing in
TestOps/sec
jQuery
$("#main li").hide();
ready
DOM
var e = document.getElementById("main").querySelectorAll("li");
for (var i = 0; i < e.length; i++) {
  e[i].style.display = "none";
}
ready

Revisions

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