getElementsByTagName vs getElementsByClassName vs querySelector (v16)

Revision 16 of this benchmark created by Dan on


Description

Test for mobile devices

Preparation HTML

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<div class="test">
   <input type="radio" class="rdbtn" />
   <input type="radio" class="rdbtn" />
   <input type="radio" class="rdbtn" />
   <input type="radio" class="rdbtn" checked="checked"/>
   <input type="radio" class="rdbtn" />
</div>
<div class="test">
   <input type="radio" class="rdbtn" />
   <input type="radio" class="rdbtn" />
   <input type="radio" class="rdbtn" />
   <input type="radio" class="rdbtn" />
   <input type="radio" class="rdbtn" />
</div>
<div class="test">
   <input type="radio" class="rdbtn" />
   <input type="radio" class="rdbtn" />
   <input type="radio" class="rdbtn" />
   <input type="radio" class="rdbtn" checked="checked"/>
   <input type="radio" class="rdbtn" />
</div>

Test runner

Ready to run.

Testing in
TestOps/sec
getElementsByTagName
var allinput = document.getElementsByTagName("input");
for (var i = 0; i < allinput.length; i++) {
  if (allinput[i].checked) {
    break;
  }
}
ready
getElementsByClassName
var allinput = document.getElementsByClassName("rdbtn");
for (var i = 0; i < allinput.length; i++) {
  if (allinput[i].checked) {
    return;
  }
}
ready
querySelectorAll(tagname)
var allinput = document.querySelectorAll("input");
for (var i = 0; i < allinput.length; i++) {
  if (allinput[i].checked) {
    return;
  }
}
ready
querySelectorAll(classname)
var allinput = document.querySelectorAll(".rdbtn");
for (var i = 0; i < allinput.length; i++) {
  if (allinput[i].checked) {
    return;
  }
}
ready
querySelector(input:checked)
document.querySelector("input:checked");
ready
$(input:checked)
$("input:checked");
ready
$(input)
var allinput = $("input");
for (var i = 0; i < allinput.length; i++) {
  if (allinput[i].checked) {
    return;
  }
}
ready

Revisions

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