Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
DataAttribute vs Class Selector vs ID Selector vs Tag vs :is()
(version: 1)
Comparing performance of:
Class vs ID vs data attribute vs :is(div, span) vs Tag
Created:
one year ago
by:
Guest
Jump to the latest result
HTML Preparation code:
<div class="hello" id="hello" data-hello>Hello</div>
Tests:
Class
document.querySelector('.hello');
ID
document.querySelector('#hello');
data attribute
document.querySelector('[data-hello]');
:is(div, span)
document.querySelector(':is(div,span)');
Tag
document.querySelector('div');
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (5)
Previous results
Fork
Test case name
Result
Class
ID
data attribute
:is(div, span)
Tag
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
2 months ago
)
User agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:147.0) Gecko/20100101 Firefox/147.0
Browser/OS:
Firefox 147 on Windows
View result in a separate tab
Embed
Embed Benchmark Result
Test name
Executions per second
Class
3669655.2 Ops/sec
ID
3701551.2 Ops/sec
data attribute
3482355.0 Ops/sec
:is(div, span)
1730229.5 Ops/sec
Tag
3751801.5 Ops/sec
Related benchmarks:
DataAttribute vs Class Selector vs ID Selector
DataAttribute vs Class Selector vs ID Selector vs AttributeSelector
DataAttribute vs Class Selector vs ID Selector vs Custom Attributes
DataAttribute vs Class Selector vs ID Selectorssssss
DataAttribute vs Class Selector vs ID Selector v2
DataAttribute vs Class Selector vs ID Selector v3
Attribute Selector vs Class Selector vs ID Selector
DataAttribute vs Class Selector vs ID Selector vs ~=
DataAttribute vs Class Selector vs ID Selector vs Class & Data Attribute Selector
Comments
Confirm delete:
Do you really want to delete benchmark?