jQuery Cached Set

JavaScript performance comparison

Revision 32 of this test case created

Info

Compare performance of cached vs repeated element selections

Preparation code

<style>
.clase{
color: "#ff0000";
text-decoration: "underline";
background-color: "#eeeeee";
}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<div id="top" class="mydiv">
  <p id="para_1" class="mytext">
    <input type="checkbox" id="check" name="check" value="Paragraph one" checked="checked" />
    <input type="checkbox" id="check" name="check" value="Paragraph one 2" />
  </p>
<script>
  var cached = jQuery('#top').find('p.mytext');
</script>

Preparation code output

Test runner

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

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
Cached elements
 
cached.css('color', '#ff0000');
cached.css('text-decoration', 'underline');
cached.css('background-color', '#eeeeee');
 pending…
No cache
 
cached.addClass("clase");
 pending…
Cache2
 
jQuery('#top').find('checkbox.checked')
 pending…
Cach3
 
cached.css({
  "color": "#ff0000",
  "text-decoration": "underline",
  "background-color": "#eeeeee"
});
 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:

0 comments

Add a comment