jsPerf.app is an online JavaScript performance benchmark test runner & jsperf.com mirror. It is a complete rewrite in homage to the once excellent jsperf.com now with hopefully a more modern & maintainable codebase.

jsperf.com URLs are mirrored at the same path, e.g:

https://jsperf.com/negative-modulo/2

Can be accessed at:

https://jsperf.app/negative-modulo/2

getting first child element using jQuery (v4)

Revision 4 of this benchmark created on February 16, 2014

Preparation HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<div>
	<ul id="ul1">unordered list
		<li>item 1</li>
		<li>item 2</li>
		<li>item 3</li>
		<li>item 4</li>
		<li>item 5</li>
		<li>item 6</li>
		<li>item 7</li>
	</ul>
	<ul>unordered list - nested children
		<li>item 1
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 2
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 3
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 4
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 5
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 6
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 7
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
	</ul>
</div>
<div>
	<ul>unordered list
		<li>item 1</li>
		<li>item 2</li>
		<li>item 3</li>
		<li>item 4</li>
		<li>item 5</li>
		<li>item 6</li>
		<li>item 7</li>
	</ul>
	<ul>unordered list - nested children
		<li>item 1
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 2
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 3
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 4
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 5
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 6
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 7
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
	</ul>
	<ul>unordered list
		<li>item 1</li>
		<li>item 2</li>
		<li>item 3</li>
		<li>item 4</li>
		<li>item 5</li>
		<li>item 6</li>
		<li>item 7</li>
	</ul>
	<ul>unordered list - nested children
		<li>item 1
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 2
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 3
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 4
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 5
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 6
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
		<li>item 7
			<ul>
				<li>sub item 1</li>
				<li>sub item 2</li>
				<li>sub item 3</li>
				<li>sub item 4</li>
				<li>sub item 5</li>
				<li>sub item 6</li>
				<li>sub item 7</li>
			</ul>
		</li>
	</ul>
</div>
<ul>unordered list
		<li>item 1</li>
		<li>item 2</li>
		<li>item 3</li>
		<li>item 4</li>
		<li>item 5</li>
		<li>item 6</li>
		<li>item 7</li>
</ul>
<ul>unordered list - nested children
<ul>unordered list - nested children
	<li>item 1
		<ul>
			<li>sub item 1</li>
			<li>sub item 2</li>
			<li>sub item 3</li>
			<li>sub item 4</li>
			<li>sub item 5</li>
			<li>sub item 6</li>
			<li>sub item 7</li>
		</ul>
	</li>
	<li>item 2
		<ul>
			<li>sub item 1</li>
			<li>sub item 2</li>
			<li>sub item 3</li>
			<li>sub item 4</li>
			<li>sub item 5</li>
			<li>sub item 6</li>
			<li>sub item 7</li>
		</ul>
	</li>
	<li>item 3
		<ul>
			<li>sub item 1</li>
			<li>sub item 2</li>
			<li>sub item 3</li>
			<li>sub item 4</li>
			<li>sub item 5</li>
			<li>sub item 6</li>
			<li>sub item 7</li>
		</ul>
	</li>
	<li>item 4
		<ul>
			<li>sub item 1</li>
			<li>sub item 2</li>
			<li>sub item 3</li>
			<li>sub item 4</li>
			<li>sub item 5</li>
			<li>sub item 6</li>
			<li>sub item 7</li>
		</ul>
	</li>
	<li>item 5
		<ul>
			<li>sub item 1</li>
			<li>sub item 2</li>
			<li>sub item 3</li>
			<li>sub item 4</li>
			<li>sub item 5</li>
			<li>sub item 6</li>
			<li>sub item 7</li>
		</ul>
	</li>
	<li>item 6
		<ul>
			<li>sub item 1</li>
			<li>sub item 2</li>
			<li>sub item 3</li>
			<li>sub item 4</li>
			<li>sub item 5</li>
			<li>sub item 6</li>
			<li>sub item 7</li>
		</ul>
	</li>
	<li>item 7
		<ul>
			<li>sub item 1</li>
			<li>sub item 2</li>
			<li>sub item 3</li>
			<li>sub item 4</li>
			<li>sub item 5</li>
			<li>sub item 6</li>
			<li>sub item 7</li>
		</ul>
	</li>
</ul>

Test runner

Ready to run.

Testing in
Test		Ops/sec
:first pseudo-selector in children method	`var x = $('#ul1').children(':first');`	ready
chaining first method to children method	`var x = $('#ul1').children().first();`	ready
eq(0) pseudo-selector in children method	`var x = $('#ul1').children(':eq(0)');`	ready
parent selector and :nth-child(1) pseudo-selector	`var x = $('#ul1 :nth-child(1)')`	ready
parent selector with > :first	`var x = $('#ul1 > :first');`	ready
parent selector with > :first-child	`var x = $('#ul1 > :first-child');`	ready
chaining filter with :first pseudo-selector to children method	`var x = $('#ul1').children().filter(':first');`	ready
chaining filter with :first-child pseudo-selector to children method	`var x = $('#ul1').children().filter(':first-child');`	ready
find method with :first pseudo-selector	`var x = $('#ul1').find(':first')`	ready
find method with :first-child pseudo-selector	`var x = $('#ul1').find(':first-child')`	ready
selector with [space] and :first pseudo-selector	`var x = $('#ul1 :first');`	ready
selector with [space] and :first-child pseudo-selector	`var x = $('#ul1 :first-child');`	ready
selector with [space] and :nth-child(1) pseudo-selector	`var x = $('#ul1 :nth-child(1)');`	ready
re-wrapping index 0 of children method back into jQuery	`var x = $($('#ul1').children()[0]);`	ready
chaining eq(0) to children	`var x = $('#ul1').children().eq(0);`	ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.

Revision 1: published on July 12, 2011
Revision 2: published on July 12, 2011
Revision 3: published on July 11, 2012
Revision 4: published on February 16, 2014