jQuery .find() vs. context selector vs non-context selector

JavaScript performance comparison

Revision 16 of this test case created by

Preparation code

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<p><ins></ins></p>

<article>
	<p>A test</p>
	<p><ins></ins></p>
	<p>This is text</p>
</article>

<p><ins></ins></p>

<article>
	<p>A test</p>
	<p><ins></ins></p>
	<p>This is text</p>
</article>
 

<p><ins></ins></p>

<article>
	<p>A test</p>
	<p><ins></ins></p>
	<p>This is text</p>
	<article>
		<p>A test</p>
		<p><ins></ins></p>
		<p>This is text</p>
		<article>
			<p>A test</p>
			<p><ins></ins></p>
			<p>This is text</p>
			<article>
				<p>A test</p>
				<p><ins></ins></p>
				<p>This is text</p>
				<article>
					<p>A test</p>
					<p><ins></ins></p>
					<p>This is text</p>
					<article>
						<p>A test</p>
						<p><ins></ins></p>
						<p>This is text</p>
							<article>
								<p>A test</p>
								<p><ins></ins></p>
								<p>This is text</p>
							</article>
					</article>
				</article>
			</article>
		</article>
	</article>
</article>
		
<article>
	<p>A test</p>
	<div>
		<div>
			<div>
				<p><ins></ins></p>
			</div>
		</div>
	</div>
	<p>This is text</p>
</article>
      
<script>
Benchmark.prototype.setup = function() {
  var $article = $('article');
  var article = $article[0];

};
</script>

Preparation code output

<p><ins></ins></p> <article> <p>A test</p> <p><ins></ins></p> <p>This is text</p> </article> <p><ins></ins></p> <article> <p>A test</p> <p><ins></ins></p> <p>This is text</p> </article> <p><ins></ins></p> <article> <p>A test</p> <p><ins></ins></p> <p>This is text</p> <article> <p>A test</p> <p><ins></ins></p> <p>This is text</p> <article> <p>A test</p> <p><ins></ins></p> <p>This is text</p> <article> <p>A test</p> <p><ins></ins></p> <p>This is text</p> <article> <p>A test</p> <p><ins></ins></p> <p>This is text</p> <article> <p>A test</p> <p><ins></ins></p> <p>This is text</p> <article> <p>A test</p> <p><ins></ins></p> <p>This is text</p> </article> </article> </article> </article> </article> </article> </article> <article> <p>A test</p> <div> <div> <div> <p><ins></ins></p> </div> </div> </div> <p>This is text</p> </article>

Test runner

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

Java applet disabled.

Testing in archive.org_bot 0.0.0 / Other 0.0.0
Test Ops/sec
find method (node context)
var has = $(article).find('ins').length > 0 ? true : false;
pending…
find method (jquery context)
var has = $($article).find('ins').length > 0 ? true : false;
pending…
context node
var has = $('ins', article).length > 0 ? true : false;
pending…
context jQuery
var has = $('ins', $article).length > 0 ? true : false;
pending…
context jQuery[0]
var has = $('ins', $article[0]).length > 0 ? true : false;
pending…
cascade
var has = $('article ins').length > 0 ? true : false;
pending…
context (no cached)
var has = $('ins', 'article').length > 0 ? true : false;
pending…
select and find
var has = $('article').find('ins').length > 0 ? true : false;
pending…
'parent > child' selector
var has = $('article > ins').length > 0 ? true : false;
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.

0 Comments

A test

This is text

A test

This is text

A test

This is text

A test

This is text

A test

This is text

A test

This is text

A test

This is text

A test

This is text

A test

This is text

A test

This is text

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy