querySelectorAll vs getElement(s)ByWhatever vs .children (v6)

Revision 6 of this benchmark created on


Preparation HTML

<div id="div">
  <p id="id0" class="class">some text 0</p>
  <p id="id1" class="class">some text 1</p>
  <p id="id2" class="class">some text 2</p>
  <p id="id3" class="class">some text 3</p>
  <p id="id4" class="class">some text 4</p>
  <p id="id5" class="class">some text 5</p>
  <p id="id6" class="class">some text 6</p>
  <p id="id7" class="class">some text 7</p>
  <p id="id8" class="class">some text 8</p>
  <p id="id9" class="class">some text 9</p>
</div>

Test runner

Ready to run.

Testing in
TestOps/sec
querySelectorAll
let elements = document.querySelectorAll(".class");
ready
getElementsByClassName
let elements = document.getElementsByClassName("class");
ready
getElementsByTagName
let elements = document.getElementsByTagName("p");
ready
getElementById
let element;
for (i = 0; i < 10; i++) 	 
   element = document.getElementById("id" + i);
ready
children
let elements = document.getElementById("div").children;
ready

Revisions

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