Benchmark: lodash flatten vs spread not broken

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 = []; const sourceObject = [ arrayA, arrayB ]; sourceObject.forEach((array) => { flattened.push(...array) }); 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);

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 year ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/127.0.0.0 Safari/537.36

Browser/OS: Chrome 127 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
spread	407969.5 Ops/sec
lodash flatten	381042.4 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks.

**Benchmark Overview**

MeasureThat.net is a website that allows users to create and run JavaScript microbenchmarks. The provided benchmark measures the performance difference between two approaches: using the spread operator (`...`) to flatten an array, and using the `_.flatten()` method from the Lodash library.

**Options Compared**

The two options being compared are:

1. **Spread Operator (`...`)**: This is a modern JavaScript feature that allows you to create a new array by spreading the elements of an existing array.
2. **Lodash _.flatten()**: The `_.flatten()` method from the Lodash library takes an array or a flat object as input and returns a new array with all elements flattened.

**Pros and Cons**

* **Spread Operator (`...`)**:
	+ Pros: Simple, concise, and efficient way to flatten arrays.
	+ Cons: Only works on modern browsers that support ES6+, may not work in older browsers or environments.
* **Lodash _.flatten()**:
	+ Pros: Well-established library with good performance, supports various input types (arrays, objects).
	+ Cons: Adds an extra dependency (Lodash), may have higher overhead due to function call and object creation.

**Library Used**

In this benchmark, the Lodash library is used. Lodash is a popular JavaScript utility library that provides a lot of functional programming helpers, including `_.flatten()`. The library is included in the HTML preparation code using a script tag, making it available for use in the benchmark tests.

**Special JS Feature or Syntax**

There are no special JavaScript features or syntaxes being tested in this benchmark. Both options rely on standard JavaScript and Lodash functionality.

**Other Alternatives**

If you're interested in exploring alternative approaches to flattening arrays, here are a few:

1. **Array.prototype.flat()**: This is a modern JavaScript method introduced in ES6 that allows you to flatten an array recursively.
2. **Loop-based approach**: You can use a simple loop to iterate over the elements of an array and push them into a new array.

Keep in mind that these alternatives may have different performance characteristics compared to the spread operator or Lodash _.flatten().

Related benchmarks:

lodash flatten vs spread not broken (version: 0)

lodash flatten vs spread

Comparing performance of: spread vs lodash flatten

Created: 6 years ago by: Guest

Jump to the latest result

spread

lodash flatten

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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