Script to visualize the execution time between each function.
npm install
npm run start
Run your favorite browser and go to http://localhost:3000
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();
On running process(), you can pass some options
test.process({
// the number of times each test will be executed. Default: 10
iteration : 10
});
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