Benchmark: Object.fromEntries vs reduce vs Map vs for of

Script Preparation code:

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

Tests:

Object.fromEntries
Object.fromEntries(Object.entries(data).map((key, value) => [key, value]));
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());
for of
const acc = {} const entries = Object.entries(data); for (let [k, v] of entries) { acc[k] = v; }
for of without caching entries
const acc = {}; for (let [k, v] of Object.entries(data)) { acc[k] = v; }

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
for of
for of without caching entries

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's dive into the benchmark and explain what's being tested, the pros and cons of each approach, and other considerations.

**Benchmark Overview**

The benchmark tests four ways to create an object from an array of key-value pairs: `Object.fromEntries`, `reduce`, `Map`, and `for...of`. The goal is to determine which method is the fastest for this specific use case.

**Test Cases**

Here's a brief explanation of each test case:

1. **`Object.fromEntries`**: This method creates an object from an array of key-value pairs using the `fromEntries` function. It's a relatively new method introduced in ECMAScript 2019.
2. **`Reduce (reuse object)`**: This approach uses the `reduce` method to create an object by accumulating key-value pairs into an existing object. The idea is to reuse the same object for each iteration.
3. **`Reduce (creating temporary objects)`**: Similar to the previous approach, but creates a new object for each iteration using the `reduce` method.
4. **`Map`**: This approach uses a `Map` object to create an object from key-value pairs. It's similar to the `for...of` loop, but uses a data structure that provides fast lookups.
5. **`For...of`**: This test case uses a traditional `for...of` loop to create an object from key-value pairs.

**Pros and Cons**

Here are some pros and cons of each approach:

* **`Object.fromEntries`**:
	+ Pros: New, efficient method that's specifically designed for this use case.
	+ Cons: Only available in ECMAScript 2019 and later versions.
* **`Reduce (reuse object)`**:
	+ Pros: Reuses the same object for each iteration, reducing overhead.
	+ Cons: May lead to unexpected behavior if not implemented correctly.
* **`Reduce (creating temporary objects)`**:
	+ Pros: Easy to implement and understand.
	+ Cons: Creates a new object for each iteration, which can be slower than reusing an existing one.
* **`Map`**:
	+ Pros: Fast lookups and efficient memory management.
	+ Cons: May have higher overhead due to the use of a data structure.
* **`For...of`**:
	+ Pros: Simple and easy to understand.
	+ Cons: May be slower than the other approaches due to the loop overhead.

**Library Used**

None. The benchmark uses only built-in JavaScript methods and syntax.

**Special JS Features or Syntax**

No special features or syntax are used in this benchmark. It's a straightforward comparison of four different methods for creating an object from key-value pairs.

**Alternatives**

If you're interested in exploring alternative approaches, here are some options:

* **`Array.prototype.reduce()`**: This method is similar to the `Reduce (reuse object)` approach, but without reusing an existing object.
* **`Array.prototype.forEach()`**: This method can be used to iterate over the key-value pairs and create a new object using an object literal.
* **`Array.prototype.map()`**: Similar to the `Map` approach, this method creates a new array of values that can then be used to create an object.

Keep in mind that these alternatives may have different performance characteristics or trade-offs compared to the original benchmark.

Latest run results:

Run details: (Test run date: 6 months ago)

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

Browser/OS: Chrome 124 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Object.fromEntries	182.2 Ops/sec
Reduce (reuse object)	1438.8 Ops/sec
Reduce (creating temporary objects)	51.3 Ops/sec
Map	936.0 Ops/sec
for of	1745.1 Ops/sec
for of without caching entries	1709.7 Ops/sec

Related benchmarks:

Object.fromEntries vs reduce vs Map vs for of (version: 0)

Comparing performance of: Object.fromEntries vs Reduce (reuse object) vs Reduce (creating temporary objects) vs Map vs for of vs for of without caching entries

Created: 6 months ago by: Guest

Jump to the latest result

Object.fromEntries

Reduce (reuse object)

Reduce (creating temporary objects)

Map

for of

for of without caching entries

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):