Benchmark: Reduce with Spread vs Map creation

Tests:

Flatten array with nested reduce and spread operator
const things = [{ nestedThings: [{ key: 'value' }, { key: 'value' }, { key: 'value' }, { key: 'value' }] }, { nestedThings: [{ key: 'value' }, { key: 'value' }, { key: 'value' }, { key: 'value' }] }, { nestedThings: [{ key: 'value' }, { key: 'value' }, { key: 'value' }, { key: 'value' }] }, { nestedThings: [{ key: 'value' }, { key: 'value' }, { key: 'value' }, { key: 'value' }] }]; const flatValues = things.reduce((acc, current) => { const nestedValues = current.nestedThings.reduce((acc2, current2) => { return [...acc2, ...current2.key] }, []); return [...acc, ...nestedValues] }, [])
Flatten array with object assignment and forEach
const things = [{ nestedThings: [{ key: 'value' }, { key: 'value' }, { key: 'value' }, { key: 'value' }] }, { nestedThings: [{ key: 'value' }, { key: 'value' }, { key: 'value' }, { key: 'value' }] }, { nestedThings: [{ key: 'value' }, { key: 'value' }, { key: 'value' }, { key: 'value' }] }, { nestedThings: [{ key: 'value' }, { key: 'value' }, { key: 'value' }, { key: 'value' }] }]; const valuesRecord = things.reduce((acc, current, index) => { const nestedValues = current.nestedThings.forEach((nestedThing, index2) => { acc[`${index}-${index2}`] = nestedThing.key; }) return acc; }, {});

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Flatten array with nested reduce and spread operator
Flatten array with object assignment and forEach

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/115.0.0.0 Safari/537.36

Browser/OS: Chrome 115 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Flatten array with nested reduce and spread operator	636264.2 Ops/sec
Flatten array with object assignment and forEach	882739.2 Ops/sec

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

LLMs can make mistakes. Check important info.

This is a JavaScript benchmark test case, specifically designed to compare the performance of two different approaches for flattening an array with nested objects.

**Benchmark Definition:**
The benchmark definition specifies that we have an array of objects, where each object has a `nestedThings` property, which contains an array of objects. The goal is to flatten this array and extract specific values from it.

**Options being compared:**

1. **Nested Reduce and Spread Operator:** This approach uses the `reduce()` method to iterate over the array, and the spread operator (`...`) to concatenate arrays.
2. **Object Assignment and forEach:** This approach uses the `forEach()` method to iterate over the array, and object assignment to store values in an object.

**Pros and Cons of each approach:**

1. **Nested Reduce and Spread Operator:**
	* Pros:
		+ Can be more concise and expressive
		+ Often preferred for its readability and simplicity
	* Cons:
		+ May have performance overhead due to the use of `reduce()`
		+ Requires attention to ensure proper handling of edge cases (e.g., empty arrays, null values)
2. **Object Assignment and forEach:**
	* Pros:
		+ Can be more efficient for large datasets
		+ Allows for easier error handling and debugging
	* Cons:
		+ May require more boilerplate code
		+ Less concise and expressive than the spread operator approach

**Library used:**

In both test cases, we don't see any explicit libraries being used. However, it's worth noting that some JavaScript environments may use built-in libraries or polyfills for certain functions, such as `reduce()`.

**Special JS feature/syntax:**
The spread operator (`...`) is a relatively modern JavaScript feature introduced in ES6 (ECMAScript 2015). While not explicitly mentioned in the benchmark definition, its usage is what sets this approach apart from the other one.

**Other alternatives:**

In addition to these two approaches, there are other ways to flatten an array with nested objects, such as:

1. **Using a library like Lodash:** Lodash provides several functions for manipulating arrays and objects, including `flatten()`.
2. **Using a custom function:** A developer could write their own function to flatten the array, using recursion or iteration.
3. **Using `Array.prototype.flat()` (ES2019+):** This method was introduced in ECMAScript 2019 and can be used to flatten arrays.

Keep in mind that these alternatives may not offer significant performance advantages over the two approaches being compared here.

Related benchmarks:

Reduce with Spread vs Map creation (version: 0)

When de

Comparing performance of: Flatten array with nested reduce and spread operator vs Flatten array with object assignment and forEach

Created: one year ago by: Guest

Jump to the latest result

Flatten array with nested reduce and spread operator

Flatten array with object assignment and forEach

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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