JSFiddle - React, Tailwind, and code Playground
CSS
div:first-child {
font-size: 20px;
font-weight: bold;
text-decoration: underline;
}
JavaScript
var start = Date.now();
var iterations = 100000;
var i, startTime, endTime;
var x = [[1, 2, 3],[4, 5, 6],[7, 8, 9]];
var min,max;
startTime = Date.now();
for (i = 0; i < iterations; i++) {
x.forEach(function(itm) {
itm.forEach(function(itmInner) {
min = (min == undefined || itmInner<min) ? itmInner : min;
max = (max == undefined || itmInner>max) ? itmInner : max;
});
});
}
console.log(max,min); // 9, 1
endTime = Date.now();
document.body.insertAdjacentHTML('beforeend', "<div>'Normal iteration' took " + (endTime - startTime) + " Milli seconds to execute</div>");
startTime = Date.now();
for (i = 0; i < iterations; i++) {
arr = [[1,2,3],[4,5,6],[7,8,9]].reduce(function (p, c) { return p.concat(c);});
max = Math.max.apply(null, arr); // 9
min = Math.min.apply(null, arr); // 1
}
console.log(max,min); // 9, 1
endTime = Date.now();
document.body.insertAdjacentHTML('beforeend', "<div>'Modern reduce' took " + (endTime - startTime) + " Milli seconds to execute</div>");