Jquery vs Sizzle vs Vanilla (v13)

Revision 13 of this benchmark created on

Preparation HTML

<div id="test"></div>

<div class="testClass"></div>

<span></span>

<script src="http://code.jquery.com/jquery-2.0.0.min.js"></script>

<script src='http://docs.kissyui.com/kissy/tools/third-party/sizzle.js'></script>

Setup

ss = function(selector) {
      'use strict';
      //if (selector.indexOf(' ') > -1)
      //  return document.querySelectorAll(selector);
      var char = selector.charAt(0);
      if (char === '#')
        return document.getElementById(selector.substring(1));
      if (char === '.')
        return document.getElementsByClassName(selector.substring(1));
      return document.getElementsByTagName(selector);
    }

Test runner

Ready to run.

Testing in
TestOps/sec
JQuery
var el = $("#test");
var el2 = $(".testClass");
var el3 = $("span");
 
ready
Sizzle
var sel = Sizzle("#test");
var sel2 = Sizzle(".testClass");
var sel3 = Sizzle("span");
ready
Vanilla getElementsBy*
var vel = document.getElementById("test");
var vel2 = document.getElementsByClassName("testClass");
var vel3 = document.getElementsByTagName("span");
ready
Vanilla querySelector
var qs = document.querySelector("#test");
var qs2 = document.querySelectorAll(".testClass");
var qs3 = document.querySelectorAll("span");
ready
pseudo selector
var qs = ss("#test");
var qs2 = ss(".testClass");
var qs3 = ss("span");
ready

Revisions

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