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

Revision 7 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
const div = document.getElementById("div");
let elements = document.querySelectorAll(".class");
ready
getElementsByClassName
const div = document.getElementById("div");
let elements = div.getElementsByClassName("class");
ready
getElementsByTagName
const div = document.getElementById("div");
let elements = div.getElementsByTagName("p");
ready
children
const div = document.getElementById("div");
let elements = div.children;
ready

Revisions

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