JSFiddle - React, Tailwind, and code Playground

JavaScript

var array = [];
for (var i = 1E6; i-- ;) array.push(i);

var sum = 0;

function add( n ) {
    sum += n;
}

function addFrom( array, i ) {
    sum += array[i];
}

var numberOfRuns = 100;

function runTest(name, f) {
    sum = 0;
    var totalTime = 0;
    console.time(name);

    for (var r = 0; r < numberOfRuns; r++) {
        f();
    }

    return console.timeEnd(name);
}

runTest('Loop, function call', function() {
		for ( var i = 1; i <= array.length; i++ ) {
		    add( array[i] );
		}
    }
);

runTest('Loop, function call #2', function() {
		for ( var i = 1; i <= array.length; i++ ) {
		    addFrom( array, i );
		}
    }
);

runTest('Loop, inlined code', function() {
		for ( var i = 1; i <= array.length; i++ ) {
		    sum += array[i];
		}
    }
);

runTest('Loop, cached value, function call', function() {
		for ( var i = 1, l = array.length; i <= l; i++ ) {
		     add( array[i] );
		}
    }
);

runTest('Loop, cached value, inlined code', function() {
		for ( var i = 1, l = array.length; i <= l; i++ ) {
		    sum += array[i];
		}
    }
);

runTest('Reverse loop, implicit comparison, function call', function() {
		for ( var i = array.length; i--; ) {
		     add( array[i] );
		}
    }
);

runTest('Reverse loop, implicit comparison, inlined code', function() {
		for ( var i = array.length; i--; ) {
		    sum += array[i];
		}
    }
);

runTest('Reverse loop, implicit comparison, function call #2', function() {
		for ( var i = array.length; i--; ) {
		     addFrom( array, i );
		}
    }
);

runTest('forEach, function call', function() {
		array.forEach(function(item) {
		     add(item);
		})
    }
);

runTest('forEach, inline code', function() {
		array.forEach(function(item) {
		     sum += item;
		})
    }
);