Run results for: joined classes jquery

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/94.0.4606.61 Safari/537.36

Browser: Chrome 94

Operating system: Mac OS X 10.15.7

Device Platform: Desktop

Date tested: 2 years ago

Test name	Executions per second
single class - getElementsByClassName?	636848.4 Ops/sec
two classes	352164.6 Ops/sec
three classes	357042.2 Ops/sec

HTML Preparation code:

<div class='test1'>
  <div class='test-child1 child1 child'></div>
</div>
<div class='test2'>
  <div class='test-child2 child2 child'></div>
</div>
<div class='test3'>
  <div class='test-child3 child3 child'></div>
</div>
<div class='test4'>
  <div class='test-child4 child4 child'></div>
</div>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js'></script>

Tests:

single class - getElementsByClassName?
jQuery('.test-child4')
two classes
jQuery('.test-child4.child4')
three classes
jQuery('.test-child4.child4.child')

Run results for: joined classes jquery

does joining more classes to a selector make it less performant?

single class - getElementsByClassName?

two classes

three classes