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
The different ways to select (context, pure selector, +find()) DOM elements using jQuery in parent/child scenarios.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<div>
<ul id="list">
<li class="test">
<div class="div-level1">
<div class="div-level2">
<div class="div-level3">
<div class="div-level4">
<div class="div-level5">
</div>
</div>
</div>
</div>
</div>
<span class="span">
</span>
<p class="p">
<span class="p-span">
</span>
</p>
</li>
<li>
<div class="div-level1">
<div class="div-level2">
<div class="div-level3">
<div class="div-level4">
<div class="div-level5">
</div>
</div>
</div>
</div>
</div>
<span class="span">
</span>
<p class="p">
<span class="p-span">
</span>
</p>
</li>
<li class="test">
</li>
<li class="test">
<div class="div-level1">
<div class="div-level2">
<div class="div-level3">
<div class="div-level4">
<div class="div-level5">
</div>
</div>
</div>
</div>
</div>
<span class="span">
</span>
<p class="p">
<span class="p-span">
</span>
</p>
</li>
<li>
<div class="div-level1">
<div class="div-level2">
<div class="div-level3">
<div class="div-level4">
<div class="div-level5">
</div>
</div>
</div>
</div>
</div>
<span class="span">
</span>
<p class="p">
<span class="p-span">
</span>
</p>
</li>
<li class="test">
<div class="div-level1">
<div class="div-level2">
<div class="div-level3">
<div class="div-level4">
<div class="div-level5">
</div>
</div>
</div>
</div>
</div>
<span class="span">
</span>
<p class="p">
<span class="p-span">
</span>
</p>
</li>
<li>
</li>
<li class="test">
<div class="div-level1">
<div class="div-level2">
<div class="div-level3">
<div class="div-level4">
<div class="div-level5">
</div>
</div>
</div>
</div>
</div>
<span class="span">
</span>
<p class="p">
<span class="p-span">
</span>
</p>
</li>
<li>
<div class="div-level1">
<div class="div-level2">
<div class="div-level3">
<div class="div-level4">
<div class="div-level5">
</div>
</div>
</div>
</div>
</div>
<span class="span">
</span>
<p class="p">
<span class="p-span">
</span>
</p>
</li>
<li class="test">
<div class="div-level1">
<div class="div-level2">
<div class="div-level3">
<div class="div-level4">
<div class="div-level5">
</div>
</div>
</div>
</div>
</div>
<span class="span">
</span>
<p class="p">
<span class="p-span">
</span>
</p>
</li>
</ul>
</div>
<div class="test">
</div>
<script>
var list = document.getElementById('list');
var $list = $('#list');
</script>
Ready to run.
Test | Ops/sec | |
---|---|---|
selector |
| ready |
context |
| ready |
selector and find |
| ready |
parent/child selector |
| ready |
context and parent/child |
| ready |
immediate children |
| ready |
You can edit these tests or add more tests to this page by appending /edit to the URL.