double call of jQuery.css vs. css property object

JavaScript performance comparison

Test case created by Florian Maertl

Info

Flow could be "left" or "right"

Preparation code

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<div id="contentDiv">Some stuff</div>
<script>
Benchmark.prototype.setup = function() {
    var contentDiv = $("#contentDiv");
    var flow = "left";
    var cssProps;
};
</script>

Preparation code output

Some stuff

Test runner

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

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
with double call to jQuery.css
contentDiv.css(
{
    position : "absolute",
    top : "0",
    "z-index" : "20",
    "background-color" : "#E7E7E7"
}).css(flow, "0").show();
pending…
with css Property object and one call to jQuery.css
cssProps =
{
    position : "absolute",
    top : "0",
    "z-index" : "20",
    "background-color" : "#E7E7E7"
};
cssProps[flow] = "0";
contentDiv.css(cssProps).show();
pending…

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

Compare results of other browsers

0 comments

Add a comment