jQuery Parents vs Closest

JavaScript performance comparison

Revision 50 of this test case created

Info

Similar to parents vs closest, only this time testing when searching >1 level of the DOM ancestors and not matching the first element.

Preparation code

<script src="//code.jquery.com/jquery-git2.min.js"></script>
<div>
  <table id="end" class="end">
    <tr>
      <td>
        <ul>
          <li>1</li>
          <li>2</li>
          <li>3</li>
          <li>4</li>
          <li>5</li>
          <li>6
            <ul>
              <li>1</li>
              <li>2</li>
              <li>3</li>
              <li>4
                <ul>
                  <li>1</li>
                  <li>2</li>
                  <li>3</li>
                  <li id="start" class="start">4</li>
                  <li>5</li>
                </ul>
              </li>
              <li>5</li>
              <li>6</li>
            </ul>
          </li>
          <li>7</li>
          <li>8</li>
          <li>9</li>
          <li>10</li>
        </ul>
      </td>
    </tr>
  </table>
</div>

Preparation code output

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
    • 1
    • 2
    • 3
    • 4
      • 1
      • 2
      • 3
      • 4
      • 5
    • 5
    • 6
  • 7
  • 8
  • 9
  • 10

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
Parents by Class
$(".start").parents("tr").first();
pending…
Closest by Class
$(".start").closest("tr");
pending…
Parents by ID
$("#start").parents("tr").first();
pending…
Closest by ID
$("#start").closest("tr");
pending…
ID Parent:first
$("#start").parents("tr:first");
pending…
ID Parent [0]
$("#start").parents('tr')[0]
pending…
closest (with context)
$(".start").closest('tr', '.end')
pending…
closest (with context and ID)
$(".start").closest('tr', '#end')
pending…
ID Parent
$("#start").parent('tr')
pending…
ID Parents [0]
$("#start").parent('tr')[0]
pending…
ID Parents eq(0)
$("#start").parent('tr').eq(0)
pending…

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:

0 comments

Add a comment