selector test id/id id/id class (v25)

Revision 25 of this benchmark created by Dmitry Erman on

Description

Rev 25 Notes: Fixed test 5 - context was backwards. Added test 7/8 to demonstrate performance of using getElementByID to grab the initial context. Also, this is not a real apples to apples test. Comparing just the main ID selector to filtering or more complex selectors are not equivalent performance metrics. Note the major difference between letting jQuery find the ID and letting the browser do it.

Preparation HTML

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


<div id="Mytbl">
<div id="MyElement"></div>
<div class="MyClass"></div>
</div>

Test runner

Ready to run.

Testing in
TestOps/sec
Direct ID
$('#MyElement');


 
ready
Nested ID's
$('#Mytbl #MyElement')
ready
ID - Class
$('#Mytbl .MyClass')
ready
find()
$("#Mytbl").find(".MyClass");
ready
Context
$("div.MyClass", "#Mytbl");
ready
ID / Class with Tag
$('#Mytbl div.MyClass')
ready
Direct ID getElementByID w/ jQuery
$(document.getElementById("Mytbl"));
 
ready
getElementByID as context
$("div.MyClass", document.getElementById("Mytbl"));
ready

Revisions

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