Performance Test

by prozoroff

HTML

<div id="results"></div>
<div id="items"></div>

CSS

#results {
    font:icon;
    font-size:11px;
}

.info {color:green;}
.error {color:red;}

JavaScript

var measure = (function() {
    var iterations = 100000,
        $results = $('#results');

    var count = 0;
    
    function log(msg) {
        console.log(msg);
        $results.append('<p class="info">' + ++count + '. ' + msg + '</p>');
    }

    function error(msg) {
        console.error(msg);
        $results.append('<p class="error">' + ++count + '. ' + msg + '</p>');
    }

    function measure(arg) {
        if ($.isArray(arg)) {
            measureMultiple(arg);
        } else if ($.isFunction(arg)) {
            measureOne(arg);
        }
    }
    
    function measureMultiple(funcs) {
        for (var i=0, len=funcs.length; i<len; ++i) {
            measureOne(funcs[i]);
        }
    }
    
    function measureOne(func) {
        var start, end, duration;

        try {
            start = new Date().getTime();
            for (var i = 0; i < iterations; ++i) {
                func();
            }
            end = new Date().getTime();

            duration = end - start;
            log(func.name + ' completed in ' + duration + ' ms.');
        } catch (err) {
            error(func.name + ' ' + err);
        }
    }

    return measure;
})();

$items = $('#items');

var arr = [1,2,3,4,5,6,7,89,8,7,6,5,4,3,2,1,2,3,4,5,67,89,9];

function func1() {
var test = [];
arr.map(function(item){
test.push(item+1);
});
}

function func2() {
var test = [];
for(var i = 0, l = arr.length; i < l; i++){
	test.push(arr[i]+1);
}
}

measure([func1,func2]);