Teepo / Bench

Bench

Script to visualize the execution time between each function.

Installation

npm install
npm run start

Run your favorite browser and go to http://localhost:3000

Getting started

var test = new Bench();

test.add(:SOME_FUNCTION_TO_TEST_1:);
test.add(:SOME_FUNCTION_TO_TEST_2:);
test.add(:SOME_FUNCTION_TO_TEST_3:);

// begin benchmark
test.process();

Options

On running process(), you can pass some options

test.process({

  // the number of times each test will be executed. Default: 10
  iteration : 10
});

Examples

var test = new Bench();

test.add(function() {

  var i = 0;
  while (i <= 100) {
    $('#log').append('<div class="lol"></div>');

      i++;
  }

  $('#log').html('');
});

test.add(function() {

    var i = 0;

    while (i <= 100) {
        var div = document.createElement('div');
        div.classList.add('lol');

        document.getElementById('log').appendChild(div);

        i++;
    }

    document.getElementById('log').innerHTML = "";
});

test.add(function() {

    var i = 0;
    while (i <= 100) {
        $('<div></div>').addClass('lol').appendTo('#log');
        i++;
    }

    $('#log').html('');
});

test.add(function() {

    var i = 0;
    while (i <= 100) {
        var div = $('<div class="lol"></div>');
        $('#log').append(div);

        i++;
    }

    $('#log').html('');
});


test.process({
    iteration: 250
});

At the end of process(), if you look in your JS console, this will be displayed :

And a graph