cell-dom-css

JavaScript performance comparison

Test case created

Preparation code

<script>
// Force require.js to load ASAP
window._setTimeout = window.setTimeout;
window.setTimeout = undefined;
</script>
<script src='https://raw.github.com/peterwmwong/cell/04fe62d8657d4be2ebf72eaad5cc6456ccdefaa5/bench/dom/built-dom.js'></script>
<script>
window.setTimeout = window._setTimeout;
</script>
<script>
require(['dom'], function(dom){
  window.dom1 = dom;
});
define = requirejs = require = undefined;
</script>

<script>
// Force require.js to load ASAP
window._setTimeout = window.setTimeout;
window.setTimeout = undefined;
</script>
<script src='https://raw.github.com/peterwmwong/cell/e7dd4381bd6e3774188f76481eab2725d2c6d402/bench/dom/built-dom.js'></script>
<script>
window.setTimeout = window._setTimeout;
</script>
<script>
require(['dom'], function(dom){
  window.dom2 = dom;
});
</script>
<script>
Benchmark.prototype.setup = function() {
    var d1 = dom1('<div></div>');
    var d2 = dom2('<div></div>');
};
</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
single (before)
d1.css('margin','2px');
d1.css('padding','1x');

d1.css('margin').length;
d1.css('padding').length;
pending…
single (after)
d2.cssSet('margin','2px');
d2.cssSet('padding','1x');

d2.css('margin').length;
d2.css('padding').length;
pending…
multi (before)
d1.css({
  margin:'2px',
  padding:'1px',
});
d1.css('margin').length;
d1.css('padding').length;
 
pending…
multi (after)
d2.cssSetAll({
  margin:'2px',
  padding:'1px',
});
d2.cssAll(['margin','padding']).length;
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