fadeIn-to-native

JavaScript performance comparison

Test case created by Kliment Petrov

Preparation code

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<div id="test"></div>
      
<script>
Benchmark.prototype.setup = function() {
  var el = document.getElementById('test');

};
</script>

Preparation code output

<div id="test"></div>

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
$(el).fadeIn();
pending…
Native
function fadeIn(el) {
  el.style.opacity = 0;

  var last = +new Date();
  var tick = function() {
    el.style.opacity = +el.style.opacity + (new Date() - last) / 400;
    last = +new Date();

    if (+el.style.opacity < 1) {
      (window.requestAnimationFrame && requestAnimationFrame(tick)) || setTimeout(tick, 16);
    }
  };

  tick();
}

fadeIn(el);
pending…

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

0 Comments