Benchmark.js

by stuttufu

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/benchmark/1.0.0/benchmark.min.js"></script>
<div class="rotating cat"></div>

CSS

.cat {
  background: url('http://placekitten.com/200/200/') no-repeat center;
  width: 200px;
  height: 200px;
}

@-webkit-keyframes rotating /* Safari and Chrome */ {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.rotating {
  -webkit-animation: rotating 2s linear infinite;
  -moz-animation: rotating 2s linear infinite;
  -ms-animation: rotating 2s linear infinite;
  -o-animation: rotating 2s linear infinite;
  animation: rotating 2s linear infinite;
}

JavaScript

var i,
    arr1=[],
    arr2=[],
	key;

for(i=0;i<100000;i++) arr1.push(i);
for(i=0;i<100000;i++) arr1.push(i);
for(i=0;i<100000;i++) arr1.push(i);
for(i=0;i<100000;i++) arr1.push(i);
for(i=0;i<100000;i++) arr1.push(i);
for(i=0;i<100000;i++) arr1.push(i);
for(i=0;i<100000;i++) arr1.push(i);
for(i=0;i<100000;i++) arr1.push(i);
for(i=0;i<100000;i++) arr1.push(i);
for(i=0;i<100000;i++) arr1.push(i);
for(i=0;i<100000;i++) arr1.push(i);
for(i=0;i<100000;i++) arr1.push(i);

arr2[12] = 12;
arr2[23] = 23;
arr2[56] = 65;

function test1()
{
    for(key in arr1)
    {
        // do nothing
    }
}

function test2()
{
    for(key in arr2)
    {
        // do nothing
    }
}

// BENCHMARK ====================

var suite = new Benchmark.Suite;

// add tests
suite
.add('test1', test1)
.add('test2', test2)
// add listeners
.on('cycle', function(event) {
  console.log(String(event.target));
})
.on('complete', function() {
  console.log('Fastest is ' + this.filter('fastest').pluck('name'));
})
// run async
.run({ 'async': true });