dom traversing (v2)

Revision 2 of this benchmark created by Grzegorz on


Description

Find out how much faster is to use document.querySelector than jQuery... assuming, that one needs nodes instead of jQuery objects.

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<div>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
</ul>
</div>
<script>
  var selector = "div>ul li";
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
querySelector
var x = document.querySelectorAll(selector);
ready
jQuery
var x = $(selector);
ready
qS w/ fallback to jQuery
var x = (function(selector) {
 return document.querySelectorAll ? document.querySelectorAll(selector) : $(selector);
})(selector);
ready
qS, but jQuery objects needed
var x = (function(selector) {
 var elems = document.querySelectorAll ? document.querySelectorAll(selector) : $(selector),
     length = elems.length;
 return $(elems);
})(selector);
ready

Revisions

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