Run results for: Test DOM elements selector

Run details:

User agent: Mozilla/5.0 (Windows NT 5.1; rv:50.0) Gecko/20100101 Firefox/50.0

Browser: Firefox 50

Operating system: Windows XP

Device Platform: Other

Date tested: 7 years ago

Test name	Executions per second
querySelectorAll:class	105.5 Ops/sec
querySelectorAll:id	229.9 Ops/sec

Script Preparation code:

// Custom query selector
function queryAll(selector) {
  if (typeof selector !== 'string') return selector;
  
  // ID
  var id_sel = selector.match(/^#([\w-]*)$/);
  if (id_sel) {
    var elem = document.getElementById(id_sel[1]);
    return (elem ? [elem] : []);  // Always return an array
  }
  
  // CLASS
  var class_sel = !id_sel && selector.match(/^\.([\w-]+)$/);
  if (class_sel) {
    var elems = document.getElementsByClassName(class_sel[1]);
    return elems;
  }
  
  // TAG
  var tag_sel = !class_sel && selector.match(/^[\w-]+$/);
  if (tag_sel) {
    var elems = document.getElementsByTagName(selector);
    return elems;
  }
  
  // Fallback
  return document.querySelectorAll(selector);
}

// Prepare DOM elements
var elements = '';
for (var i=0, len=10000; i<len; i++){
  elements += '<div id="someid" class="someclass el'+i+'">'+i+'</div>';
}
document.body.innerHTML += elements;

Tests:

querySelectorAll:class
document.querySelectorAll('.someclass');
querySelectorAll:id
document.querySelectorAll('#someid');

Run results for: Test DOM elements selector

querySelectorAll:class

querySelectorAll:id