Benchmark: Object.fromEntries vs reduce vs Map vs Object.assign vs forEach (fixed)

Script Preparation code:

var data = { ...Array.from(Array(10000).keys()) };

Tests:

Object.fromEntries
Object.fromEntries(Object.entries(data).map(([key, value]) => [key, value.toString()]));
Reduce (reuse object)
Object.entries(data).reduce((acc, [k, v]) => { acc[k] = v.toString(); return acc; }, {});
Reduce (creating temporary objects)
Object.entries(data).reduce((acc, [k, v]) => ({ ...acc, [k]: v.toString() }), {});
Map
Object.entries(data).reduce((acc, [k, v]) => { acc.set(k, v.toString()) return acc; }, new Map());
forEach
const result = {}; Object.entries(data).forEach(([key, value]) => { result[key] = value.toString(); });
Object.assign
Object.assign( {}, ...Object.entries(data).map(([key, value]) => ({ [key]: value })) );

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Object.fromEntries
Reduce (reuse object)
Reduce (creating temporary objects)
Map
forEach
Object.assign

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 123 on Windows

View result in a separate tab

Test name	Executions per second
Object.fromEntries	1536.7 Ops/sec
Reduce (reuse object)	3432.9 Ops/sec
Reduce (creating temporary objects)	121.0 Ops/sec
Map	2108.3 Ops/sec
forEach	3552.5 Ops/sec
Object.assign	374.2 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 provided benchmark and explain what is being tested, compared, and their pros and cons.

**Benchmark Overview**

The benchmark compares six different approaches to create an object from an array of key-value pairs:

1. `Object.fromEntries`
2. Reduce (using an object as an accumulator)
3. Reduce (creating a temporary object)
4. Map
5. `forEach` loop
6. `Object.assign`

**Test Cases**

Each test case has a unique implementation to create the object from the array of key-value pairs.

1. `Object.fromEntries`: This method is used in modern browsers and Node.js versions 14.13.0 or later.
2. Reduce (reuse object): This approach uses an existing object as an accumulator and appends new properties to it.
3. Reduce (creating temporary objects): Similar to the previous one, but a new object is created for each iteration instead of reusing an existing one.
4. Map: This method returns a new Map object with key-value pairs from the array.
5. `forEach` loop: A traditional loop using a `forEach` callback function.
6. `Object.assign`: This method is used to create a shallow copy of an array by mapping over it and assigning each value to a property on an existing object.

**Pros and Cons**

Here's a brief summary of the pros and cons for each approach:

1. **`Object.fromEntries`**:
	* Pros: Fast, modern, and widely supported.
	* Cons: Not available in older browsers or Node.js versions.
2. Reduce (reuse object):
	* Pros: Reuses memory, potentially faster than creating a new object.
	* Cons: May cause performance issues if the accumulator is large or frequently updated.
3. Reduce (creating temporary objects):
	* Pros: Easy to understand and implement.
	* Cons: Creates multiple temporary objects, which can lead to increased memory allocation and garbage collection overhead.
4. Map:
	* Pros: Creates a new Map object with key-value pairs from the array, which can be useful in certain scenarios.
	* Cons: May not be as efficient as other methods due to the creation of a new object.
5. `forEach` loop:
	* Pros: Easy to understand and implement.
	* Cons: Potentially slower than other methods due to the overhead of creating a temporary variable for each iteration.
6. `Object.assign`:
	* Pros: Fast and efficient, especially when dealing with shallow copies.
	* Cons: May not be suitable for all use cases, such as when working with large objects or multiple array sources.

**Other Considerations**

* **Memory allocation**: Reducing memory allocation by reusing objects can lead to better performance, but may increase the overhead of garbage collection if the accumulator is frequently updated.
* **Browser support**: Older browsers may not support certain methods like `Object.fromEntries`, `Map`, or `reduce`.
* **Node.js versions**: The availability of certain methods and polyfills may vary across different Node.js versions.

**Alternatives**

If you don't have access to modern browsers or need alternative implementations, consider the following alternatives:

1. Use a library like Lodash (`_` utility) for `reduce`, `map`, and other functional programming utilities.
2. Implement a custom reducer function using a stack-based approach (e.g., using an array to store intermediate results).
3. Consider using a framework or library that provides optimized implementations of these methods, such as React's `useMemo` hook.

When selecting an approach, consider the trade-offs between performance, memory usage, and browser support. For most use cases, `Object.fromEntries` or Reduce (reuse object) should provide the best balance of efficiency and practicality.

Related benchmarks:

Object.fromEntries vs reduce vs Map vs Object.assign vs forEach (fixed) (version: 0)

Comparing performance of: Object.fromEntries vs Reduce (reuse object) vs Reduce (creating temporary objects) vs Map vs forEach vs Object.assign

Created: 2 years ago by: Guest

Jump to the latest result

Object.fromEntries

Reduce (reuse object)

Reduce (creating temporary objects)

Map

forEach

Object.assign

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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