select vs natives vs jQuery (v2)

Revision 2 of this benchmark created on

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<div></div>
<div id="foo"></div>
<div class="bar"></div>
<script>
function select (selector, context) {
    var c = selector.charAt(0), 
        method,
        context = context || document;

    if (c === '#') {
        selector = selector.substring(1);
        method = context.getElementById(selector);
    } 

    else if (c === '.') {
        selector = selector.substring(1);
        method = context.getElementsByClassName(selector);
    } 

    else {
        method = context.getElementsByTagName(selector);
    }

    return method
}

var By = {
  id: function _byId(id) {
    return document.getElementById(id);
  },
  tag: function _byTag(tag, context) {
    return (context || document).getElementsByTagName(tag);
  },
  "class": function _byClass(klass, context) {
    return (context || document).getElementsByClassName(klass);
  }
};
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
native
document.getElementsByTagName("div");
document.getElementById("foo");
document.getElementsByClassName("bar");
ready
select
select("div");
select("#foo");
select(".bar");
ready
QSA
document.querySelectorAll("div");
document.querySelectorAll("#foo");
document.querySelectorAll(".bar");
ready
By
By.id("foo");
By.class("bar");
By.tag("div");
ready
jQuery
$("div");
$("#foo");
$(".bar");
ready

Revisions

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