MeasureThat.net

Run results for: getElementById and getElementsByClassName[0] unique class

Test performance of different ways of get just one particular DOM element

Go to the benchmark
Run details:
Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:136.0) Gecko/20100101 Firefox/136.0
Firefox 136
Windows
Desktop
one month ago
Test name Executions per second
getElementById 28853520.0 Ops/sec
getElementById and getElementsByClassName 21813820.0 Ops/sec
HTML Preparation code:
AخA
 
1
<div id="testdiv">
2
  <div id="unique1" class="unique" name="unique" data-unique="1">test1</div>
3
  <div id="unique2" class="unique1" name="unique" data-unique="2">test2</div>
4
  <div id="unique3" class="unique" name="unique" data-unique="3">test3</div>
5
  <div id="unique4" class="unique" name="unique" data-unique="4">test4</div>
6
  <div id="unique5" class="unique" name="unique" data-unique="5">test5</div>
7
</div>
Script Preparation code:
 
var i, imax;
var doc = document;
Tests:

  • getElementById

     
    var test = doc.getElementById('testdiv').childNodes[0].innerHTML;

  • getElementById and getElementsByClassName

     
    var test = doc.getElementsByClassName('unique1')[0].innerHTML;