Benchmark: Flatten Arrays - Large

Script Preparation code:

const size = 100000
const innerSize = size
function getInnerArray() {
  return new Array(size).fill().map(() => parseInt(Math.random() * innerSize + 1))
}
var BaseArrays = new Array(size).fill().map(() => getInnerArray())
function concatArray(finalArray) {
   BaseArrays.forEach((array) => {
     finalArray = finalArray.concat(array)
   })
}
function spreadArray(finalArray) {
   BaseArrays.forEach((array) => {
     finalArray = [...finalArray, ...array]
   })
}
function reduceArraySpread(finalArray) {
   finalArray = BaseArrays.reduce((prev, current) => [...prev, ...current], [])
}
function reduceArrayConcat(finalArray) {
   finalArray = BaseArrays.reduce((prev, current) => prev.concat(current), [])
}
function flatArray(finalArray) {
   finalArray = BaseArrays.flat()
}
function mergedArray(finalArray) {
   finalArray = [].concat.apply([], BaseArrays);
}
function flatten (arr, finalArray = []) {
  for (let i = 0, length = arr.length; i < length; i++) {
    const value = arr[i];
    if (Array.isArray(value)) {
      flatten(value, finalArray);
    } else {
      finalArray.push(value);
    }
  }
  return finalArray;
};

Tests:

concat
let finalArray = [] concatArray(finalArray)
spread
let finalArray = [] spreadArray(finalArray)
reduce spread
let finalArray = [] reduceArraySpread(finalArray)
reduce concat
let finalArray = [] reduceArrayConcat(finalArray)
flat
let finalArray = [] flatArray(finalArray)
concat apply
let finalArray = [] mergedArray(finalArray)
Flatten self-made
let finalArray = [] flatten(BaseArrays, finalArray)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
concat
spread
reduce spread
reduce concat
flat
concat apply
Flatten self-made

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 28 days ago):

LLMs can make mistakes. Check important info.

**Benchmark Overview**

The provided benchmark is designed to test different methods for flattening a 2D array into a single 1D array in JavaScript. The benchmark definition JSON file provides the script preparation code, which creates a large 2D array with random inner arrays and tests six different flattening functions:

1. `concatArray`
2. `spreadArray`
3. `reduceArraySpread`
4. `reduceArrayConcat`
5. `flatArray`
6. A custom implementation of flattening (`flatten` function)

**Options Compared**

The benchmark compares the performance of each flattening method across different executions per second.

**Pros and Cons of Each Approach**

1. **concatArray**: This approach concatenates all inner arrays to the final array. It can be efficient for small arrays but may lead to slower performance for large arrays due to the overhead of repeated concatenations.
2. **spreadArray**: Similar to `concatArray`, this approach spreads the inner arrays into the final array using the spread operator (`...`). However, it may have better cache locality and performance for large arrays.
3. **reduceArraySpread** and **reduceArrayConcat**: These approaches use the `Array.prototype.reduce()` method to concatenate or spread the inner arrays into the final array. They are likely to be more efficient than `concatArray` and `spreadArray` for large arrays, but may require more memory accesses due to the intermediate results.
4. **flatArray**: This approach uses the `Array.prototype.flat()` method, which is a more modern and efficient way of flattening arrays. It is likely to perform better than the custom implementation (`flatten`) but may not be supported by older browsers or environments.
5. **Custom Implementation (flatten)**: This implementation uses recursion to flatten the array. While it is straightforward to understand, it may have higher overhead due to repeated function calls and checks.

**Library Usage**

None of the flattening functions use any external libraries beyond JavaScript's built-in `Array.prototype` methods.

**Special JS Features or Syntax**

The benchmark does not explicitly test any special JavaScript features or syntax. However, it relies on modern JavaScript features such as:

* ES6 spread operator (`...`)
* ES7 flat() method
* Array.prototype.reduce() method

**Other Alternatives**

If you want to explore alternative flattening methods, consider the following options:

1. Using `Array.prototype.flatMap()` (ES2019+): This method is similar to `flat()` but also preserves the original array's structure.
2. Using a library like Lodash's `flattenDeep` function: This function can handle more complex cases and may be faster than the built-in methods for very large arrays.
3. Implementing a custom flattening algorithm using bitwise operations or other low-level techniques.

Keep in mind that these alternatives may require additional considerations, such as compatibility with older browsers or environments, and may have varying performance characteristics.

Latest run results:

Run details: (Test run date: 4 years ago)

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

Browser/OS: Chrome 85 on Windows

View result in a separate tab

Test name	Executions per second
concat	354576.9 Ops/sec
spread	47708.6 Ops/sec
reduce spread	45260.7 Ops/sec
reduce concat	338760.9 Ops/sec
flat	40375.2 Ops/sec
concat apply	939680.7 Ops/sec
Flatten self-made	37447.1 Ops/sec

Related benchmarks:

Flatten Arrays - Large (version: 3)

What is the best way to flatten 2d arrays into 1 array of items

Comparing performance of: concat vs spread vs reduce spread vs reduce concat vs flat vs concat apply vs Flatten self-made

Created: 4 years ago by: Registered User

Jump to the latest result

concat

spread

reduce spread

reduce concat

flat

concat apply

Flatten self-made

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 28 days ago):