Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Run results for:
querySelector vs. getElementsByClassName[0]
Go to the benchmark
Embed
Embed Benchmark Result
Run details:
User agent:
Mozilla/5.0 (X11; Linux x86_64; rv:150.0) Gecko/20100101 Firefox/150.0
Browser:
Firefox 150
Operating system:
Linux
Device Platform:
Desktop
Date tested:
3 months ago
getElementsByClassName
8.8M/s
querySelector
7.7M/s
View exact numbers
Test name
Executions per second
✓
getElementsByClassName
8,755,118 Ops/sec
querySelector
7,746,412 Ops/sec
HTML Preparation code:
<div> <ul> <li> <a href="#" name="name" class="classname">item 1</a> </li> <li> <a href="#" name="name" class="classname">item 2</a> </li> <li> <a href="#" name="name" class="classname">item 3</a> </li> <li> <a href="#" name="name" class="classname">item 4</a> </li> <li> <a href="#" name="name" class="classname">item 5</a> </li> <li> <a href="#" name="name" class="classname">item 6</a> </li> <li> <a href="#" name="name" class="classname">item 7</a> </li> <li> <a href="#" name="name" class="classname">item 8</a> </li> <li> <a href="#" name="name" class="classname">item 9</a> </li> <li> <a href="#" name="name" class="classname">item 10</a> </li> </ul> </div>
Tests:
querySelector
document.querySelector('.classname')
getElementsByClassName
document.getElementsByClassName('classname')[0]