querySelector vs querySelector with ID

Benchmark created on


Description

Getting a select with a known ID vs using generic HTML attr

Preparation HTML

<div class="container">
 <select id="some-select" class="my-select"></select>
</div>

Setup

const container = document.getElementsByClassName("container")[0]

Test runner

Ready to run.

Testing in
TestOps/sec
querySelector with tag
const select = container.querySelector("select");
ready
querySelector with ID
const select = container.querySelector("#some-select");
ready
querySelector class curiosity
const select = container.querySelector(".my-select");
ready
getElementByID curiosity (can't use container)
const select = document.getElementById("some-select")
ready

Revisions

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