Benchmark: JQuery: find vs id selector on large dom

HTML Preparation code:

<div>
  <div id="parent1">
    <div id="parent-1-1">
      <div id="parent-1-1">
        <div id="parent-1-1-1">
        </div>
      </div>
    </div>
  </div>
</div>
<div>
  <div id="parent2">
    <div id="parent-2-1">
      <div id="parent-2-1">
        <div id="parent-2-1-1">
        </div>
      </div>
    </div>
  </div>
</div>
<div>
  <div id="parent3">
    <div id="parent-3-1">
      <div id="parent-3-1">
        <div id="parent-3-1-1">
        </div>
      </div>
    </div>
  </div>
</div>
<div>
  <div id="parent4">
    <div id="parent-4-1">
      <div id="parent-4-1">
        <div id="parent-4-1-1">
        </div>
      </div>
    </div>
  </div>
</div>
<div>
  <div id="parent5">
    <div id="parent-5-1">
      <div id="parent-5-1">
        <div id="parent-5-1-1">
        </div>
      </div>
    </div>
  </div>
</div>
<div>
  <div id="parent6">
    <div id="parent-6-1">
      <div id="parent-6-1">
        <div id="parent-6-1-1">
        </div>
      </div>
    </div>
  </div>
</div>
<div>
  <div id="parent7">
    <div id="parent-7-1">
      <div id="parent-7-1">
        <div id="parent-7-1-1">
        </div>
      </div>
    </div>
  </div>
</div>
<div>
  <div id="parent8">
    <div id="parent-8-1">
      <div id="parent-8-1">
        <div id="parent-8-1-1">
        </div>
      </div>
    </div>
  </div>
</div>
<div>
  <div>
    <div>
      <div>
        <div>
          <a id="parent">
            <span id="child">Need span</span>
            <svg class="icon md-16 icon-shevron-right text-muted"></svg>
          </a>
        </div>
      </div>
    </div>
  </div>
</div>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.js'></script>

Script Preparation code:

var $element = $("#parent");

Tests:

find
$element.find("span");
ID
$("#child");

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
find
ID

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

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

Browser/OS: Chrome 130 on Mac OS X 10.15.7

View result in a separate tab

6.0M/s

find

3.4M/s

View exact numbers

Test name	Executions per second
✓ ID	5,987,665 Ops/sec
find	3,384,618 Ops/sec

JQuery: find vs id selector on large dom (version: 1)

Comparing performance of: `find vs ID`

Created: one year ago by: Guest

Go to the latest result

find

ID

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

JQuery: find vs id selector on large dom (version: 1)

Comparing performance of: find vs ID

Created: one year ago by: Guest

Go to the latest result

find

ID

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Related benchmarks

Comparing performance of: `find vs ID`