Run results for: Chunk array from vs reduce vs for

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36 OPR/107.0.0.0

Browser: Opera 107

Operating system: Mac OS X 10.15.7

Device Platform: Desktop

Date tested: 6 months ago

Script Preparation code:

var elements = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];
var size = 5;

Tests:

Array from
const result = Array.from({ length: Math.ceil(elements.length / size) }, (_, i) => elements.slice(i * size, (i + 1) * size));
reduce
const result = elements.reduce( (elems, elem, i) => i % size === 0 ? [...elems, [elem]]: [...elems.slice(0, -1), [...elems[elems.length - 1], elem]], [] );
for
const result = []; for (let i = 0; i < elements.length; ++i) { if (i % size === 0) result.push([elements[i]]); else result[result.length - 1].push(elements[i]); }
another for
const result = []; for (let i = 0; i < elements.length; ++i) { if (i % size === 0) result.push([]); result[result.length - 1].push(elements[i]); }
one more
const result = []; let index = -1; for (let i = 0; i < elements.length; ++i) { if (i % size === 0) { index += 1; result.push([elements[i]]); } else result[index].push(elements[i]); }
last for loop
const result = Array(Math.ceil(elements.length / size)).fill().map(() => Array(size)); let index = -1; let subIndex = 0; for (let i = 0; i < elements.length; ++i) { if (i % size === 0) { index++; subIndex = 0; } result[index][subIndex] = elements[i]; subIndex++; }
okay real last
const result = Array(Math.ceil(elements.length / size)).fill().map(() => Array(size)); for (let i = 0; i < elements.length; ++i) { result[Math.floor(i / size)][i % size] = elements[i]; }