Benchmark: Array.from(Array(length), () => new Array(length)) vs Array.from(new Array(length), () => new Array(length)) vs Array.from({length}, () => new Array(length)) vs for loop push vs for loop index v2

Array.from(Array(length), () => new Array(length)) vs Array.from(new Array(length), () => new Array(length)) vs Array.from({length}, () => new Array(length)) vs for loop push vs for loop index v2 (version: 2)

Comparing performance of: Array.from(new Array(length), () => new Array(length)) vs Array.from({length}, () => new Array(length)) vs for push vs for index vs Array.from(Array(length), () => new Array(length)) vs for push set size vs for index set size

Created: one year ago by: Registered User

Jump to the latest result

Tests:

Array.from(new Array(length), () => new Array(length))
const i = 25; const j = 25; const a = Array.from(new Array(i), () => new Array(j))
AخA

const i = 25;
const j = 25;
const a = Array.from(new Array(i), () => new Array(j))
Array.from({length}, () => new Array(length))
const i = 25; const j = 25; const a = Array.from({length:i}, () => new Array(j))
const i = 25;
const j = 25;
const a = Array.from({length:i}, () => new Array(j))

for push

const i = 25;
const j = 25;
const a = []
for (let k = 0; k < i; k++) {
  a.push(new Array(j));
}

 
const i = 25;const j = 25;const a = []for (let k = 0; k < i; k++) {  a.push(new Array(j));}

for index

const i = 25;
const j = 25;
const a = []
for (let k = 0; k < i; k++) {
  a[k] = new Array(j);
}

 
const i = 25;const j = 25;const a = []for (let k = 0; k < i; k++) {  a[k] = new Array(j);}

Array.from(Array(length), () => new Array(length))
const i = 25; const j = 25; const a = Array.from(Array(i), () => new Array(j))
const i = 25;
const j = 25;
const a = Array.from(Array(i), () => new Array(j))
for push set size
const i = 25; const j = 25; const a = [] a.length = i; for (let k = 0; k < i; k++) { a.push(new Array(j)); }
const i = 25;
const j = 25;
const a = []
a.length = i;
for (let k = 0; k < i; k++) {
a.push(new Array(j));
}

for index set size

const i = 25;
const j = 25;
const a = []
a.length = i;
for (let k = 0; k < i; k++) {
  a[k] = new Array(j);
}

 
const i = 25;const j = 25;const a = []a.length = i;for (let k = 0; k < i; k++) {  a[k] = new Array(j);}

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

Memory measurements supported only in Chrome.
For precise memory measurements Chrome must be launched with --enable-precise-memory-info flag.
More information: Monitoring JavaScript Memory

Test case name	Result
Array.from(new Array(length), () => new Array(length))
Array.from({length}, () => new Array(length))
for push
for index
Array.from(Array(length), () => new Array(length))
for push set size
for index set size

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/109.0.0.0 Safari/537.36

Browser/OS: Chrome 109 on Windows

View result in a separate tab

Test name	Executions per second
Array.from(new Array(length), () => new Array(length))	160453.8 Ops/sec
Array.from({length}, () => new Array(length))	150472.2 Ops/sec
for push	227218.6 Ops/sec
for index	239894.0 Ops/sec
Array.from(Array(length), () => new Array(length))	161594.3 Ops/sec
for push set size	221498.6 Ops/sec
for index set size	233617.0 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated 7 months ago):

Benchmark Overview

The provided benchmark is designed to compare the performance of different approaches for creating nested arrays in JavaScript. The test cases cover various scenarios, including using Array.from(), loops (for push and for index), and an object literal.

Tested Options

Array.from(new Array(length), () => new Array(length)): Creates a 2D array by mapping over a one-dimensional array of the specified length.
Array.from({length:i}, () => new Array(j)): Creates a 2D array by mapping over an object literal with a specified length and mapping each element to a 1D array of the same length as j.
For loop push: Uses a for loop to push arrays onto another array.
For loop index: Uses a for loop to initialize elements in an array.
for push set size: Initializes an array with a specified size and then pushes arrays onto it using a for loop.
for index set size: Initializes an array with a specified size and then initializes each element using a for loop.

Comparison of Approaches

Performance: The Array.from() approach is generally faster than the loop-based approaches, especially for larger arrays. This is because Array.from() uses optimized internal logic to create arrays efficiently.
Readability: Loop-based approaches can be more readable and maintainable for developers who are familiar with JavaScript loops.
Memory allocation: The for push and for index approaches allocate memory for each array individually, which can lead to slower performance due to the overhead of repeated memory allocations. In contrast, the Array.from() approach allocates memory all at once.

Library

None of the tested options rely on a specific library or framework.

Special JavaScript Features/Syntax

None of the tested options use special JavaScript features or syntax, such as async/await, generators, or classes.

Alternatives

Some alternatives to the Array.from() approach include:

Array.prototype.map(): Similar to Array.from(), but returns a new array with the mapped values, rather than an array of arrays.
Using a library like Lodash or Ramda: These libraries provide various functions for working with arrays and can be used instead of Array.from() in some cases.

Overall, the choice of approach depends on the specific requirements and constraints of your project. If performance is critical, Array.from() may be the best option. However, if readability and maintainability are more important, a loop-based approach might be a better choice.

LLMs can make mistakes. Check important info.

**Benchmark Overview**

The provided benchmark is designed to compare the performance of different approaches for creating nested arrays in JavaScript. The test cases cover various scenarios, including using `Array.from()`, loops (for push and for index), and an object literal.

**Tested Options**

1. **`Array.from(new Array(length), () => new Array(length))`**: Creates a 2D array by mapping over a one-dimensional array of the specified length.
2. **`Array.from({length:i}, () => new Array(j))`**: Creates a 2D array by mapping over an object literal with a specified length and mapping each element to a 1D array of the same length as `j`.
3. **For loop push**: Uses a for loop to push arrays onto another array.
4. **For loop index**: Uses a for loop to initialize elements in an array.
5. **`for push set size`**: Initializes an array with a specified size and then pushes arrays onto it using a for loop.
6. **`for index set size`**: Initializes an array with a specified size and then initializes each element using a for loop.

**Comparison of Approaches**

*   **Performance**: The `Array.from()` approach is generally faster than the loop-based approaches, especially for larger arrays. This is because `Array.from()` uses optimized internal logic to create arrays efficiently.
*   **Readability**: Loop-based approaches can be more readable and maintainable for developers who are familiar with JavaScript loops.
*   **Memory allocation**: The `for push` and `for index` approaches allocate memory for each array individually, which can lead to slower performance due to the overhead of repeated memory allocations. In contrast, the `Array.from()` approach allocates memory all at once.

**Library**

None of the tested options rely on a specific library or framework.

**Special JavaScript Features/Syntax**

None of the tested options use special JavaScript features or syntax, such as async/await, generators, or classes.

**Alternatives**

Some alternatives to the `Array.from()` approach include:

*   **`Array.prototype.map()`**: Similar to `Array.from()`, but returns a new array with the mapped values, rather than an array of arrays.
*   **Using a library like Lodash or Ramda**: These libraries provide various functions for working with arrays and can be used instead of `Array.from()` in some cases.

Overall, the choice of approach depends on the specific requirements and constraints of your project. If performance is critical, `Array.from()` may be the best option. However, if readability and maintainability are more important, a loop-based approach might be a better choice.

Related benchmarks: