Run results for: querySelector and getElementsByClassName performance

Run details:

User agent: Mozilla/5.0 (Linux; Android 12) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/98.0.4758.102 Safari/537.36

Browser: Chrome 98

Operating system: Android

Device Platform: Desktop

Date tested: 2 years ago

Test name	Executions per second
querrySelector	1277707.9 Ops/sec
getElementsByClassName	2993944.8 Ops/sec

HTML Preparation code:

<div class="test1"></div>
<div class="test1">
    <div class="test1"></div>
    <div class="test1"></div>
    <div class="test1">
        <div class="test1">
            <div class="test1"></div>
        </div>
    </div>
    <div class="test1"></div>
    <div class="test1"></div>
</div>
<div class="test1">
    <div class="test1"></div>
    <div class="test1">
        <div class="test1">
            <div class="test1"></div>
        </div>
    </div>
    <div class="test1">
        <div class="test1">
            <div class="test1"></div>
        </div>
    </div>
    <div class="test1"></div>
</div>
<div class="test1"></div>
<div class="test1">
    <div class="test1"></div>
    <div class="test1">
        <div class="test1">
            <div class="test1"></div>
        </div>
        <div class="test1"></div>
    </div>
    <div class="test1"></div>
    <div class="test1"></div>
    <div class="test1"></div>
</div>
<div class="test1"></div>
<div class="test1">
    <div class="test1">
        <div class="test1"></div>
        <div class="test1">
            <div class="test1">
                <div class="test1">
                    <div class="test"></div>
                </div>
                <div class="test1">
                    <div class="test1"></div>
                </div>
                <div class="test1"></div>
            </div>
            <div class="test1"></div>
        </div>
    </div>
    <div class="test1"></div>
    <div class="test1"></div>
</div>
<div class="test1">
    <div class="test1"></div>
    <div class="test1">
        <div class="test1"></div>
        <div class="test1"></div>
    </div>
    <div class="test1"></div>
    <div class="test1"></div>
    <div class="test1"></div>
</div>

Tests:

querrySelector
document.querySelector(".test")
getElementsByClassName
document.getElementsByClassName("test")

Run results for: querySelector and getElementsByClassName performance

querrySelector

getElementsByClassName