Run results for: queryselector vs getelementbyid with classes and ids

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:139.0) Gecko/20100101 Firefox/139.0

Browser: Firefox 139

Operating system: Mac OS X 10.15

Device Platform: Desktop

Date tested: 10 months ago

Test name	Executions per second
querySelector	6337271.5 Ops/sec
getElementById	8550460.0 Ops/sec

HTML Preparation code:

<div class="container">
  <div class="header"></div>
    <div class="content">
    <div class="title"></div>
    <div class="text">
    	<div id="testElement"></div>
    </div>
  </div>
  <div class="footer"></div>
</div>

Tests:

querySelector
var el = document.querySelector('#testElement'); var className = el.className;
getElementById
var el = document.getElementById('testElement'); var className = el.className;

Run results for: queryselector vs getelementbyid with classes and ids

querySelector

getElementById