Benchmark: lodash flatten vs array.flat

HTML Preparation code:


<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>

Tests:

spread
const arrayA = ['hi', 'hi', 'hi', 'hi']; const arrayB = ['hi', 'hi', 'hi', 'hi']; const flattened = [ arrayA, arrayB ].flat(); console.log(flattened);
lodash flatten
const arrayA = ['hi', 'hi', 'hi', 'hi']; const arrayB = ['hi', 'hi', 'hi', 'hi']; const flattened = []; const sourceObject = [ arrayA, arrayB ]; sourceObject.forEach((array) => { flattened.push(array) }); _.flatten(flattened); console.log(flattened);

Historical Performance Data aggregated from 124 community runs

Desktop Results:

Chrome 102 runs

spread

266K/s

lodash flatten

264K/s

View exact numbers

✓ spread: 265,969 ops/sec
• lodash flatten: 264,353 ops/sec

Firefox 16 runs

lodash flatten

244K/s

spread

238K/s

View exact numbers

✓ lodash flatten: 244,441 ops/sec
• spread: 237,989 ops/sec

Safari 6 runs

spread

1.4M/s

lodash flatten

1.1M/s

Fastest: spread (1.2x faster)

View exact numbers

✓ spread: 1,376,545 ops/sec
• lodash flatten: 1,119,900 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
spread
lodash flatten

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 150 on Windows

View result in a separate tab

spread

285K/s

lodash flatten

264K/s

View exact numbers

Test name	Executions per second
✓ spread	285,219 Ops/sec
lodash flatten	264,182 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the JavaScript microbenchmark and explain what is being tested.

**Benchmark Definition**

The benchmark compares two approaches to flattening arrays: using `Array.flat()` (also known as the spread operator) and using Lodash's `_flatten()` function.

**Options Compared**

1. **Spread Operator (`Array.flat()`)**: This method uses the spread operator (`...`) to expand the array into a new array.
2. **Lodash's `_flatten()` function**: This is a utility function from the popular Lodash library that flattens an array of arrays into a single array.

**Pros and Cons**

* **Spread Operator (`Array.flat()`)**:
	+ Pros: Simple, concise, and widely supported by modern browsers.
	+ Cons: May not be as efficient as other methods, especially for large arrays.
* **Lodash's `_flatten()` function**:
	+ Pros: More flexible and customizable than the spread operator.
	+ Cons: Requires including an additional library (Lodash) and may have slower performance due to the overhead of function calls.

**Library: Lodash**

Lodash is a popular JavaScript utility library that provides a wide range of functions for tasks such as array manipulation, string manipulation, and more. The `_flatten()` function is one of its many utilities designed to simplify common programming tasks.

**Special JS Feature/Syntax: None**

Neither of the two approaches used in this benchmark relies on any special JavaScript features or syntax.

**Other Alternatives**

If you want to flatten an array without using `Array.flat()` or Lodash's `_flatten()`, you can use other methods such as:

1. Using `concat()` and `push()`: Iterate over each element of the original array, pushing it onto a new array.
2. Using a for loop and push(): Similar to the previous approach, but with a more concise syntax.
3. Using `reduce()`: Use the `reduce()` method to accumulate elements from an array into a single array.

Keep in mind that these alternatives may have different performance characteristics than using `Array.flat()` or Lodash's `_flatten()` function.

I hope this explanation helps you understand what is being tested in the MeasureThat.net benchmark!

lodash flatten vs array.flat (version: 0) Benchmark.js

lodash flatten vs spread

Comparing performance of: `spread vs lodash flatten`

Created: 5 years ago by: Guest

Go to the latest result

spread

lodash flatten

Historical Performance Data aggregated from 124 community runs

Desktop Results:

Chrome 102 runs

Firefox 16 runs

Safari 6 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

lodash flatten vs array.flat (version: 0) Benchmark.js

lodash flatten vs spread

Comparing performance of: spread vs lodash flatten

Created: 5 years ago by: Guest

Go to the latest result

spread

lodash flatten

Historical Performance Data aggregated from 124 community runs

Desktop Results:

Chrome 102 runs

Firefox 16 runs

Safari 6 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

Comparing performance of: `spread vs lodash flatten`