MeasureThat.net

Run results for: querySelector and getElementsByClassName performance

Go to the benchmark
Run details:
Mozilla/5.0 (Linux; Android 12) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/98.0.4758.102 Safari/537.36
Chrome 98
Android
Desktop
3 years ago
Test name Executions per second
querrySelector 1277707.9 Ops/sec
getElementsByClassName 2993944.8 Ops/sec
HTML Preparation code:
AخA
 
1
<div class="test1"></div>
2
<div class="test1">
3
    <div class="test1"></div>
4
    <div class="test1"></div>
5
    <div class="test1">
6
        <div class="test1">
7
            <div class="test1"></div>
8
        </div>
9
    </div>
10
    <div class="test1"></div>
11
    <div class="test1"></div>
12
</div>
13
<div class="test1">
14
    <div class="test1"></div>
15
    <div class="test1">
16
        <div class="test1">
17
            <div class="test1"></div>
18
        </div>
19
    </div>
20
    <div class="test1">
21
        <div class="test1">
22
            <div class="test1"></div>
23
        </div>
24
    </div>
25
    <div class="test1"></div>
26
</div>
27
<div class="test1"></div>
28
<div class="test1">
29
    <div class="test1"></div>
30
    <div class="test1">
31
        <div class="test1">
32
            <div class="test1"></div>
33
        </div>
34
        <div class="test1"></div>
35
    </div>
36
    <div class="test1"></div>
37
    <div class="test1"></div>
38
    <div class="test1"></div>
39
</div>
40
<div class="test1"></div>
41
<div class="test1">
42
    <div class="test1">
43
        <div class="test1"></div>
44
        <div class="test1">
45
            <div class="test1">
46
                <div class="test1">
47
                    <div class="test"></div>
48
                </div>
49
                <div class="test1">
50
                    <div class="test1"></div>
51
                </div>
52
                <div class="test1"></div>
53
            </div>
54
            <div class="test1"></div>
55
        </div>
56
    </div>
57
    <div class="test1"></div>
58
    <div class="test1"></div>
59
</div>
60
<div class="test1">
61
    <div class="test1"></div>
62
    <div class="test1">
63
        <div class="test1"></div>
64
        <div class="test1"></div>
65
    </div>
66
    <div class="test1"></div>
67
    <div class="test1"></div>
68
    <div class="test1"></div>
69
</div>
Tests:

  • querrySelector

     
    document.querySelector(".test")

  • getElementsByClassName

     
    document.getElementsByClassName("test")