Run results for: Different types of selecting

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.1.2 Safari/605.1.15

Browser: Safari 13

Operating system: Mac OS X 10.15.6

Device Platform: Desktop

Date tested: 4 years ago

Test name	Executions per second
getElementById	4272996.5 Ops/sec
querySelector("#id")	2777207.2 Ops/sec
getElementsByClassName("class")[0]	3372902.2 Ops/sec
querySelector(".class")	2916002.5 Ops/sec
getElementById + getElementsByTagName	3752813.8 Ops/sec
querySelectorAll("#id tag")	1688024.6 Ops/sec
getElementById + getElementsByClassName[0]	3149851.8 Ops/sec
querySelector("#id .class")	2713082.5 Ops/sec
getElementsByClassName("class")	3869838.8 Ops/sec
querySelectorAll(".class")	1915822.8 Ops/sec

HTML Preparation code:

<div>
  <ul id="id1">
    <li class="c1">Element</li>
    <li id="id2" class="c1">Element</li>
    <li class="c1">Element</li>
    <li class="c1">Element</li>
  </ul>
</div>

Tests:

getElementById
document.getElementById("id2")
querySelector("#id")
document.querySelector("#id2")
getElementsByClassName("class")[0]
document.getElementsByClassName("c1")[0]
querySelector(".class")
document.querySelector(".c1")
getElementById + getElementsByTagName
document.getElementById("id1").getElementsByTagName("li")
querySelectorAll("#id tag")
document.querySelectorAll("#id1 li")
getElementById + getElementsByClassName[0]
document.getElementById("id1").getElementsByClassName("c1")[0]
querySelector("#id .class")
document.querySelector("#id1 .c1")
getElementsByClassName("class")
document.getElementsByClassName("c1")
querySelectorAll(".class")
document.querySelectorAll(".c1")

Run results for: Different types of selecting

getElementById

querySelector("#id")

getElementsByClassName("class")[0]

querySelector(".class")

getElementById + getElementsByTagName

querySelectorAll("#id tag")

getElementById + getElementsByClassName[0]

querySelector("#id .class")

getElementsByClassName("class")

querySelectorAll(".class")