selector api (version: 1)

getElementById, getElementsByClassName, querySelector, querySelectorAll

Comparing performance of: getElementById vs getElementsByClassName vs querySelector(ID) vs querySelector(class) vs querySelectorAll(ID) vs querySelectorAll(class)

Created: 6 months ago by: Guest
Go to the latest result
HTML Preparation code:
Tests:
Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results
  • Test case name Result
    getElementById
    getElementsByClassName
    querySelector(ID)
    querySelector(class)
    querySelectorAll(ID)
    querySelectorAll(class)

    Fastest: N/A

    Slowest: N/A

Latest run results:
Run details: (Test run date: 6 months ago)
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36
Chrome 143 on Mac OS X 10.15.7
View result in a separate tab
getElementById
49.6M/s
querySelector(class)
33.5M/s
getElementsByClassName
18.3M/s
querySelector(ID)
11.5M/s
querySelectorAll(class)
10.7M/s
querySelectorAll(ID)
5.9M/s
View exact numbers
Test name Executions per second
✓ getElementById 49,599,152 Ops/sec
querySelector(class) 33,518,056 Ops/sec
getElementsByClassName 18,256,212 Ops/sec
querySelector(ID) 11,522,663 Ops/sec
querySelectorAll(class) 10,741,314 Ops/sec
querySelectorAll(ID) 5,871,253 Ops/sec

Related benchmarks