JSFiddle - React, Tailwind, and code Playground
JavaScript
var arr1 = [],
arr2 = [],
obj1 = {},
obj2 = {}; // get max array length
for (i = 0; i <= 10000; i++) {
arr1.push(i);
arr2.push(i);
}
for (i = 10001; i <= 20000; i++) {
arr2.push(i);
}
function oneLoop() {
obj1 = {};
obj2 = {};
var length = Math.max(arr1.length, arr2.length);
for (var i = 0; i < length; i++) { // loop max array length
if (i < arr1.length) { // do check for arr1
obj1[i] = arr1[i];
}
if (i < arr2.length) { // do check for arr2
obj2[i] = arr2[i];
}
}
}
function twoLoops() {
obj1 = {};
obj2 = {};
for (var i = 0; i < arr1.length; i++) {
obj1[i] = arr1[i];
}
for (var i = 0; i < arr2.length; i++) {
obj2[i] = arr2[i];
}
}
var t0 = performance.now();
oneLoop();
var t1 = performance.now();
document.body.appendChild(document.createTextNode("Call to oneLoop took " + (t1 - t0) + " milliseconds."));
document.body.appendChild(document.createElement('br'));
var t2 = performance.now();
twoLoops();
var t3 = performance.now();
document.body.appendChild(document.createTextNode("Call to twoLoops took " + (t2 - t1) + " milliseconds."));
document.body.appendChild(document.createElement('br'));