jQuery Parents vs Closest

JavaScript performance comparison

Revision 6 of this test case created on 11th August 2011
Info

Similar to parent vs closest, only this time testing when searching >1 level of the DOM ancestors.
Preparation code

<div class="name">
        <div class="name">
                <div class="name">
                        <div class="name">
                                <div class="name">
                                        <div class="name">
                                                <div class="name">
                                                        <div class="name">
                                                                <div class="name">
                                                                        <div class="name">
                                                                                <div class="name">
                                                                                        <div class="name">
                                                                                                <div class="name">
                                                                                                        <div class="name">
                                                                                                                <div class="name">
                                                                                                                        <div class="name">
                                                                                                                                <div class="name">
                                                                                                                                        <div class="name">
                                                                                                                                                <div class="parent">
                                                                                                                                                        <div class="name">
                                                                                                                                                                <div class="name">
                                                                                                                                                                        <div class="name">
                                                                                                                                                                                <div class="name">
                                                                                                                                                                                        <div class="child">

                                                                                                                                                                                        </div>
                                                                                                                                                                                </div>
                                                                                                                                                                        </div>
                                                                                                                                                                </div>
                                                                                                                                                        </div>
                                                                                                                                                </div>
                                                                                                                                        </div>
                                                                                                                                </div>
                                                                                                                        </div>
                                                                                                                </div>
                                                                                                        </div>
                                                                                                </div>
                                                                                        </div>
                                                                                </div>
                                                                        </div>
                                                                </div>
                                                        </div>
                                                </div>
                                        </div>
                                </div>
                        </div>
                </div>
        </div>
</div>
<div class="name">
        <div class="name">
                <div class="name">
                        <div class="name">
                                <div class="name">
                                        <div class="name">
                                                <div class="name">
                                                        <div class="name">
                                                                <div class="name">
                                                                        <div class="name">
                                                                                <div class="name">
                                                                                        <div class="name">
                                                                                                <div class="name">
                                                                                                        <div class="name">
                                                                                                                <div class="name">
                                                                                                                        <div class="name">
                                                                                                                                <div class="name">
                                                                                                                                        <div class="name">
                                                                                                                                                <div class="parent">
                                                                                                                                                        <div class="name">
                                                                                                                                                                <div class="name">
                                                                                                                                                                        <div class="name">
                                                                                                                                                                                <div class="name">
                                                                                                                                                                                        <div class="child">

                                                                                                                                                                                        </div>
                                                                                                                                                                                </div>
                                                                                                                                                                        </div>
                                                                                                                                                                </div>
                                                                                                                                                        </div>
                                                                                                                                                </div>
                                                                                                                                        </div>
                                                                                                                                </div>
                                                                                                                        </div>
                                                                                                                </div>
                                                                                                        </div>
                                                                                                </div>
                                                                                        </div>
                                                                                </div>
                                                                        </div>
                                                                </div>
                                                        </div>
                                                </div>
                                        </div>
                                </div>
                        </div>
                </div>
        </div>
</div>
<div class="name">
        <div class="name">
                <div class="name">
                        <div class="name">
                                <div class="name">
                                        <div class="name">
                                                <div class="name">
                                                        <div class="name">
                                                                <div class="name">
                                                                        <div class="name">
                                                                                <div class="name">
                                                                                        <div class="name">
                                                                                                <div class="name">
                                                                                                        <div class="name">
                                                                                                                <div class="name">
                                                                                                                        <div class="name">
                                                                                                                                <div class="name">
                                                                                                                                        <div class="name">
                                                                                                                                                <div class="parent">
                                                                                                                                                        <div class="name">
                                                                                                                                                                <div class="name">
                                                                                                                                                                        <div class="name">
                                                                                                                                                                                <div class="name">
                                                                                                                                                                                        <div class="child">

                                                                                                                                                                                        </div>
                                                                                                                                                                                </div>
                                                                                                                                                                        </div>
                                                                                                                                                                </div>
                                                                                                                                                        </div>
                                                                                                                                                </div>
                                                                                                                                        </div>
                                                                                                                                </div>
                                                                                                                        </div>
                                                                                                                </div>
                                                                                                        </div>
                                                                                                </div>
                                                                                        </div>
                                                                                </div>
                                                                        </div>
                                                                </div>
                                                        </div>
                                                </div>
                                        </div>
                                </div>
                        </div>
                </div>
        </div>
</div>
<div class="name">
        <div class="name">
                <div class="name">
                        <div class="name">
                                <div class="name">
                                        <div class="name">
                                                <div class="name">
                                                        <div class="name">
                                                                <div class="name">
                                                                        <div class="name">
                                                                                <div class="name">
                                                                                        <div class="name">
                                                                                                <div class="name">
                                                                                                        <div class="name">
                                                                                                                <div class="name">
                                                                                                                        <div class="name">
                                                                                                                                <div class="name">
                                                                                                                                        <div class="name">
                                                                                                                                                <div class="parent">
                                                                                                                                                        <div class="name">
                                                                                                                                                                <div class="name">
                                                                                                                                                                        <div class="name">
                                                                                                                                                                                <div class="name">
                                                                                                                                                                                        <div class="child">

                                                                                                                                                                                        </div>
                                                                                                                                                                                </div>
                                                                                                                                                                        </div>
                                                                                                                                                                </div>
                                                                                                                                                        </div>
                                                                                                                                                </div>
                                                                                                                                        </div>
                                                                                                                                </div>
                                                                                                                        </div>
                                                                                                                </div>
                                                                                                        </div>
                                                                                                </div>
                                                                                        </div>
                                                                                </div>
                                                                        </div>
                                                                </div>
                                                        </div>
                                                </div>
                                        </div>
                                </div>
                        </div>
                </div>
        </div>
</div>
<div class="name">
        <div class="name">
                <div class="name">
                        <div class="name">
                                <div class="name">
                                        <div class="name">
                                                <div class="name">
                                                        <div class="name">
                                                                <div class="name">
                                                                        <div class="name">
                                                                                <div class="name">
                                                                                        <div class="name">
                                                                                                <div class="name">
                                                                                                        <div class="name">
                                                                                                                <div class="name">
                                                                                                                        <div class="name">
                                                                                                                                <div class="name">
                                                                                                                                        <div class="name">
                                                                                                                                                <div class="parent">
                                                                                                                                                        <div class="name">
                                                                                                                                                                <div class="name">
                                                                                                                                                                        <div class="name">
                                                                                                                                                                                <div class="name">
                                                                                                                                                                                        <div class="child">

                                                                                                                                                                                        </div>
                                                                                                                                                                                </div>
                                                                                                                                                                        </div>
                                                                                                                                                                </div>
                                                                                                                                                        </div>
                                                                                                                                                </div>
                                                                                                                                        </div>
                                                                                                                                </div>
                                                                                                                        </div>
                                                                                                                </div>
                                                                                                        </div>
                                                                                                </div>
                                                                                        </div>
                                                                                </div>
                                                                        </div>
                                                                </div>
                                                        </div>
                                                </div>
                                        </div>
                                </div>
                        </div>
                </div>
        </div>
</div>
<div class="name">
        <div class="name">
                <div class="name">
                        <div class="name">
                                <div class="name">
                                        <div class="name">
                                                <div class="name">
                                                        <div class="name">
                                                                <div class="name">
                                                                        <div class="name">
                                                                                <div class="name">
                                                                                        <div class="name">
                                                                                                <div class="name">
                                                                                                        <div class="name">
                                                                                                                <div class="name">
                                                                                                                        <div class="name">
                                                                                                                                <div class="name">
                                                                                                                                        <div class="name">
                                                                                                                                                <div class="parent">
                                                                                                                                                        <div class="name">
                                                                                                                                                                <div class="name">
                                                                                                                                                                        <div class="name">
                                                                                                                                                                                <div class="name">
                                                                                                                                                                                        <div class="child">

                                                                                                                                                                                        </div>
                                                                                                                                                                                </div>
                                                                                                                                                                        </div>
                                                                                                                                                                </div>
                                                                                                                                                        </div>
                                                                                                                                                </div>
                                                                                                                                        </div>
                                                                                                                                </div>
                                                                                                                        </div>
                                                                                                                </div>
                                                                                                        </div>
                                                                                                </div>
                                                                                        </div>
                                                                                </div>
                                                                        </div>
                                                                </div>
                                                        </div>
                                                </div>
                                        </div>
                                </div>
                        </div>
                </div>
        </div>
</div>
<div class="name">
        <div class="name">
                <div class="name">
                        <div class="name">
                                <div class="name">
                                        <div class="name">
                                                <div class="name">
                                                        <div class="name">
                                                                <div class="name">
                                                                        <div class="name">
                                                                                <div class="name">
                                                                                        <div class="name">
                                                                                                <div class="name">
                                                                                                        <div class="name">
                                                                                                                <div class="name">
                                                                                                                        <div class="name">
                                                                                                                                <div class="name">
                                                                                                                                        <div class="name">
                                                                                                                                                <div class="parent">
                                                                                                                                                        <div class="name">
                                                                                                                                                                <div class="name">
                                                                                                                                                                        <div class="name">
                                                                                                                                                                                <div class="name">
                                                                                                                                                                                        <div class="child">

                                                                                                                                                                                        </div>
                                                                                                                                                                                </div>
                                                                                                                                                                        </div>
                                                                                                                                                                </div>
                                                                                                                                                        </div>
                                                                                                                                                </div>
                                                                                                                                        </div>
                                                                                                                                </div>
                                                                                                                        </div>
                                                                                                                </div>
                                                                                                        </div>
                                                                                                </div>
                                                                                        </div>
                                                                                </div>
                                                                        </div>
                                                                </div>
                                                        </div>
                                                </div>
                                        </div>
                                </div>
                        </div>
                </div>
        </div>
</div>
<div class="name">
        <div class="name">
                <div class="name">
                        <div class="name">
                                <div class="name">
                                        <div class="name">
                                                <div class="name">
                                                        <div class="name">
                                                                <div class="name">
                                                                        <div class="name">
                                                                                <div class="name">
                                                                                        <div class="name">
                                                                                                <div class="name">
                                                                                                        <div class="name">
                                                                                                                <div class="name">
                                                                                                                        <div class="name">
                                                                                                                                <div class="name">
                                                                                                                                        <div class="name">
                                                                                                                                                <div class="parent">
                                                                                                                                                        <div class="name">
                                                                                                                                                                <div class="name">
                                                                                                                                                                        <div class="name">
                                                                                                                                                                                <div class="name">
                                                                                                                                                                                        <div class="child">

                                                                                                                                                                                        </div>
                                                                                                                                                                                </div>
                                                                                                                                                                        </div>
                                                                                                                                                                </div>
                                                                                                                                                        </div>
                                                                                                                                                </div>
                                                                                                                                        </div>
                                                                                                                                </div>
                                                                                                                        </div>
                                                                                                                </div>
                                                                                                        </div>
                                                                                                </div>
                                                                                        </div>
                                                                                </div>
                                                                        </div>
                                                                </div>
                                                        </div>
                                                </div>
                                        </div>
                                </div>
                        </div>
                </div>
        </div>
</div>
<div class="name">
        <div class="name">
                <div class="name">
                        <div class="name">
                                <div class="name">
                                        <div class="name">
                                                <div class="name">
                                                        <div class="name">
                                                                <div class="name">
                                                                        <div class="name">
                                                                                <div class="name">
                                                                                        <div class="name">
                                                                                                <div class="name">
                                                                                                        <div class="name">
                                                                                                                <div class="name">
                                                                                                                        <div class="name">
                                                                                                                                <div class="name">
                                                                                                                                        <div class="name">
                                                                                                                                                <div class="parent">
                                                                                                                                                        <div class="name">
                                                                                                                                                                <div class="name">
                                                                                                                                                                        <div class="name">
                                                                                                                                                                                <div class="name">
                                                                                                                                                                                        <div class="child">

                                                                                                                                                                                        </div>
                                                                                                                                                                                </div>
                                                                                                                                                                        </div>
                                                                                                                                                                </div>
                                                                                                                                                        </div>
                                                                                                                                                </div>
                                                                                                                                        </div>
                                                                                                                                </div>
                                                                                                                        </div>
                                                                                                                </div>
                                                                                                        </div>
                                                                                                </div>
                                                                                        </div>
                                                                                </div>
                                                                        </div>
                                                                </div>
                                                        </div>
                                                </div>
                                        </div>
                                </div>
                        </div>
                </div>
        </div>
</div>
<div class="name">
        <div class="name">
                <div class="name">
                        <div class="name">
                                <div class="name">
                                        <div class="name">
                                                <div class="name">
                                                        <div class="name">
                                                                <div class="name">
                                                                        <div class="name">
                                                                                <div class="name">
                                                                                        <div class="name">
                                                                                                <div class="name">
                                                                                                        <div class="name">
                                                                                                                <div class="name">
                                                                                                                        <div class="name">
                                                                                                                                <div class="name">
                                                                                                                                        <div class="name">
                                                                                                                                                <div class="parent">
                                                                                                                                                        <div class="name">
                                                                                                                                                                <div class="name">
                                                                                                                                                                        <div class="name">
                                                                                                                                                                                <div class="name">
                                                                                                                                                                                        <div class="child">

                                                                                                                                                                                        </div>
                                                                                                                                                                                </div>
                                                                                                                                                                        </div>
                                                                                                                                                                </div>
                                                                                                                                                        </div>
                                                                                                                                                </div>
                                                                                                                                        </div>
                                                                                                                                </div>
                                                                                                                        </div>
                                                                                                                </div>
                                                                                                        </div>
                                                                                                </div>
                                                                                        </div>
                                                                                </div>
                                                                        </div>
                                                                </div>
                                                        </div>
                                                </div>
                                        </div>
                                </div>
                        </div>
                </div>
        </div>
</div>
<div class="name">
        <div class="name">
                <div class="name">
                        <div class="name">
                                <div class="name">
                                        <div class="name">
                                                <div class="name">
                                                        <div class="name">
                                                                <div class="name">
                                                                        <div class="name">
                                                                                <div class="name">
                                                                                        <div class="name">
                                                                                                <div class="name">
                                                                                                        <div class="name">
                                                                                                                <div class="name">
                                                                                                                        <div class="name">
                                                                                                                                <div class="name">
                                                                                                                                        <div class="name">
                                                                                                                                                <div class="parent">
                                                                                                                                                        <div class="name">
                                                                                                                                                                <div class="name">
                                                                                                                                                                        <div class="name">
                                                                                                                                                                                <div class="name">
                                                                                                                                                                                        <div class="child">

                                                                                                                                                                                        </div>
                                                                                                                                                                                </div>
                                                                                                                                                                        </div>
                                                                                                                                                                </div>
                                                                                                                                                        </div>
                                                                                                                                                </div>
                                                                                                                                        </div>
                                                                                                                                </div>
                                                                                                                        </div>
                                                                                                                </div>
                                                                                                        </div>
                                                                                                </div>
                                                                                        </div>
                                                                                </div>
                                                                        </div>
                                                                </div>
                                                        </div>
                                                </div>
                                        </div>
                                </div>
                        </div>
                </div>
        </div>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
Preparation code output

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	`$("div.child").parents("div.parent")`	pending…
Closest	`$("div.child").closest("div.parent")`	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:
Revision 1: published on 8th June 2011
Revision 2: published on 8th June 2011
Revision 3: published on 20th July 2011
Revision 4: published on 21st July 2011
Revision 5: published on 28th July 2011
Revision 6: published on 11th August 2011
Revision 8: published on 19th January 2012
Revision 9: published by p on 31st May 2012
Revision 10: published on 15th June 2012
Revision 11: published on 23rd June 2012
Revision 12: published on 22nd August 2012
Revision 13: published on 28th August 2012
Revision 15: published on 12th September 2012
Revision 16: published on 19th October 2012
Revision 18: published on 14th January 2013
Revision 19: published on 23rd January 2013
Revision 20: published on 25th January 2013
Revision 22: published on 20th February 2013
Revision 23: published on 21st February 2013
Revision 24: published on 28th February 2013
Revision 25: published on 21st March 2013
Revision 26: published on 31st March 2013
Revision 27: published on 3rd April 2013
Revision 28: published on 9th April 2013
Revision 29: published on 17th April 2013
Revision 30: published on 17th April 2013
Revision 31: published on 22nd April 2013
Revision 32: published 2 weeks ago
Revision 33: published 1 week ago