jQuery .closest( '.class' ) vs custom closestByClassName( 'class' )
JavaScript performance comparison
Preparation code
<section>
<div><div><div><div><div id="end" class="end"><div><div><div><div><div><div><div><div>
<article>
<p>
<span id="start" class="start"></span>
</p>
</article>
</div></div></div></div></div></div></div></div></div></div></div></div></div>
</section>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
Benchmark.prototype.setup = function() {
var startJQ = $( '#start' ),
startDOM = $( '#start' )[0];
Element.prototype.closestByClassName = function ( className ) {
return this.className && this.className.split( ' ' ).indexOf( className ) > -1
? this
: ( this.parentNode.closestByClassName && this.parentNode.closestByClassName( className ) );
};
};
</script>
Preparation code output
Test runner
Warning! For accurate results, please disable Firebug before running the tests. (Why?)
Java applet disabled.
| Test | Ops/sec | |
|---|---|---|
closest( '.class' ) |
|
pending… |
custom closestByClassName |
|
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 by ThinkingStiff
- Revision 2: published by eternal
0 comments