Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
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:
5 years ago
by:
Registered User
Jump to the latest result
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>
Run tests (7)
Previous results
Fork
Test case name
Result
concat
spread
reduce spread
reduce concat
flat
concat apply
Flatten self-made
Fastest:
N/A
Slowest:
N/A
Latest run results:
No previous run results
This benchmark does not have any results yet. Be the first one
to run it!
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
**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.
Related benchmarks:
Array concat vs spread operator vs push for array flat implementation
array concat vs push vs spread
map vs flatMap
spread large array (50000 elements) performance (vs slice, splice, concat, for)
Comments
Confirm delete:
Do you really want to delete benchmark?