Selection syntaxt (v2)

Revision 2 of this benchmark created on

Preparation HTML

<div id="pop-up">
	<div class="hijo-a"></div>
	<div class="hijo-b"></div>
	<div class="hijo-c"></div>
</div>

Test runner

Ready to run.

Testing in
TestOps/sec
1
const popUp = document.getElementById("pop-up");
const hijoA = popUp.getElementsByClassName("hijo-a")[0];
const hijoB = popUp.getElementsByClassName("hijo-b")[0];
const hijoC = popUp.getElementsByClassName("hijo-c")[0];
ready
2
const popUp = document.querySelector("#pop-up");
const hijoA = popUp.querySelector(".hijo-a");
const hijoB = popUp.querySelector(".hijo-b");
const hijoC = popUp.querySelector(".hijo-c");
ready
3
const hijoA = document.querySelector("#pop-up .hijo-a");
const hijoB = document.querySelector("#pop-up .hijo-b");
const hijoC = document.querySelector("#pop-up .hijo-c");
ready
4
const hijoA = document.getElementsByClassName("hijo-a")[0];
const hijoB = document.getElementsByClassName("hijo-b")[0];
const hijoC = document.getElementsByClassName("hijo-c")[0];
ready
5
const popUp = document.getElementById("pop-up");
const hijoA = popUp.querySelector(".hijo-a");
const hijoB = popUp.querySelector(".hijo-b");
const hijoC = popUp.querySelector(".hijo-c");
ready

Revisions

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