21127479

JavaScript performance comparison

Test case created by

Preparation code

<style>
html, body {
    height:100%;
}
body {
    background: url('http://placedog.com/200/150') 0 0 / 100% auto no-repeat;
}
</style><script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

    

Preparation code output

<style> html, body { height:100%; } body { background: url('http://placedog.com/200/150') 0 0 / 100% auto no-repeat; } </style>

Test runner

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

Java applet disabled.

Testing in CCBot 2.0.0 / Other 0.0.0
Test Ops/sec
jQuery
var img = new Image();
img.src = $('body').css('background-image').replace(/url\(|\)$/ig, "");

$(window).on("resize", function () {
    $('body').height($('body').width() * img.height / img.width);
}).resize();
pending…
Plain JS
var img = new Image();
img.src = window.getComputedStyle(document.body).getPropertyValue("background-image").replace(/url\(|\)$/ig, "");

function resize(){
    var bgHeight = document.body.offsetWidth * img.height / img.width;
    document.body.style.height = bgHeight + 'px';
}
window.onresize = resize; resize();
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