jQuery vs. document.querySelector (v31)

Revision 31 of this benchmark created on

Description

Testing just returning the object.

Preparation HTML

<div id="main">
  <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>
<script src="https://code.jquery.com/jquery-2.0.3.min.js"></script>

Setup

window.S = function (selector, all) {
      if (all) {
        return $(document.querySelectorAll(selector));
      }
    
      return $(document.querySelector(selector));
    };

Teardown


    var el = document.querySelector("#main ul:first-child");
    el.style.display = "list-item";

Test runner

Ready to run.

Testing in
TestOps/sec
jQuery
$("#main ul:first-child");
ready
DOM
document.querySelectorAll("#main ul:first-child");
ready
querySelector
document.querySelector("#main ul");
ready
wrappedNative
S('#main ul:first-child');
ready

Revisions

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