Benchmark: Array flatten implementations [high volume]

Script Preparation code:

var params = [];
for (let i = 0; i < 100; i++) {
    const arr = [];
    for (let j = 0; j < 1000; j++) {
        arr.push(999 * Math.random());
    }
    params.push(arr);
}

function getTotal(arr) {
    let total = 0;
    for (let i = 0; i < arr.length; i++) {
        total += arr[i].length;
    }
    return total;
}

Tests:

reduce + concat
return params.reduce((acc, val) => acc.concat(val), []);
flat
return params.flat();
Manual copy by index #1
const result = new Array(getTotal(params)); for (let i = 0; i < params.length; i++) { for (let j = 0; j < params[i].length; j++) { result[params[i].length * i + j] = params[i][j]; } } return result;
Manual copy by index #2
const result = new Array(getTotal(params)); for (let i = 0, k = 0; i < params.length; i++) { const arr = params[i]; for (let j = 0; j < arr.length; j++) { result[k] = arr[j]; k++; } } return result;
Manual copy with push
const result = []; for (let i = 0; i < params.length; i++) { const arr = params[i]; for (let j = 0; j < arr.length; j++) { result.push(arr[j]); } } return result;
reduce + spread
return params.reduce((acc, val) => [...acc, ...val], []);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
reduce + concat
flat
Manual copy by index #1
Manual copy by index #2
Manual copy with push
reduce + spread

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 5 months ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:146.0) Gecko/20100101 Firefox/146.0

Browser/OS: Firefox 146 on Windows

View result in a separate tab

Test name	Executions per second
reduce + concat	193.7 Ops/sec
flat	1742.6 Ops/sec
Manual copy by index #1	2351.8 Ops/sec
Manual copy by index #2	2923.5 Ops/sec
Manual copy with push	2726.7 Ops/sec
reduce + spread	35.9 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

**Overview**

The provided benchmark measures the performance of different approaches to flatten nested arrays in JavaScript. The test cases compare various methods, including `flat()`, manual copying by index, and using the `reduce()` method with concatenation or spreading.

**Tested Approaches**

1. **`flat()`**: This is a built-in JavaScript method that flattens an array of arrays into a one-dimensional array.
2. **Manual Copy by Index #1**: This approach uses two nested loops to copy each element from the inner arrays to a new array, using indices to access and assign values.
3. **Manual Copy by Index #2**: Similar to the previous method, but with an additional variable `k` used to keep track of the index in the resulting array.
4. **Manual Copy with Push**: This approach uses the `push()` method to add elements from inner arrays to a new array.
5. **Reduce() + Concat**: This method uses the `reduce()` function to concatenate all elements from the input arrays into a single array.
6. **Reduce() + Spread**: Similar to the previous method, but using the spread operator (`...`) instead of concatenation.

**Pros and Cons**

*   **`flat()`**:
    *   Pros: Simple, efficient, and widely supported.
    *   Cons: May not be suitable for very deep arrays or large inputs due to memory limitations.
*   **Manual Copy by Index**:
    *   Pros: Flexible and can handle any array depth or size. Can also be used as a learning experience.
    *   Cons: Generally slower than built-in methods like `flat()` and may cause issues with out-of-bounds errors if not implemented carefully.
*   **Manual Copy with Push**:
    *   Pros: Simple to understand and implement, especially for those familiar with the `push()` method.
    *   Cons: Less efficient than other approaches due to repeated calls to `push()`, which can lead to performance issues with large arrays.

**Library Usage**

There is no library explicitly mentioned in the provided benchmark. However, some libraries like Lodash or Ramda might provide optimized versions of these methods.

**Special JS Feature or Syntax**

The provided benchmark does not mention any special JavaScript features or syntax that would require additional context for interpretation.

**Other Alternatives**

Some alternative approaches to flattening arrays could include:

*   **`map()` and `flat()```**: This approach uses the `map()` method to apply a transformation function to each element in the array, followed by calling `flat()` to flatten the resulting array.
*   **`flatMap()`**: If you're using a modern browser or a library that supports it, `flatMap()` is another concise way to flatten an array of arrays.

These alternatives can provide different trade-offs between readability, performance, and memory usage, so they may not always be suitable for every use case.

Related benchmarks:

Array flatten implementations [high volume] (version: 0)

Compare various ways to flatten nested arrays 1 level deep.

Comparing performance of: reduce + concat vs flat vs Manual copy by index #1 vs Manual copy by index #2 vs Manual copy with push vs reduce + spread

Created: 5 years ago by: Guest

Jump to the latest result

reduce + concat

flat

Manual copy by index #1

Manual copy by index #2

Manual copy with push

reduce + spread

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):