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: 2 years 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))
Array.from({length}, () => new Array(length))
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)); }
for index
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))
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)); }
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); }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

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: 2 years 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 one year ago):

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: