Benchmark: Object.fromEntries vs reduce(fork)

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 (reuse object(null))
Object.entries(data).reduce((acc, [k, v]) => { acc[k] = v.toString(); return acc; }, Object.create(null));

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Object.fromEntries
Reduce (reuse object)
Reduce (reuse object(null))

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/121.0.0.0 Safari/537.36 Edg/121.0.0.0

Browser/OS: Chrome 121 on Windows

View result in a separate tab

Test name	Executions per second
Object.fromEntries	141.9 Ops/sec
Reduce (reuse object)	407.5 Ops/sec
Reduce (reuse object(null))	192.4 Ops/sec

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

LLMs can make mistakes. Check important info.

**Benchmark Overview**

MeasureThat.net is a website that allows users to create and run JavaScript microbenchmarks. The provided benchmark compares the performance of three approaches: `Object.fromEntries`, `reduce` with an empty object (`{}`), and `reduce` with a null object (`Object.create(null)`).

**Test Cases**

The test cases measure the execution time of each approach on an array of 10,000 key-value pairs. The data is created using `Array.from(Array(10000).keys())`, which generates an array of numbers from 0 to 9,999.

The three approaches are:

1. **`Object.fromEntries`**: This method creates a new object from an iterable (in this case, an array of key-value pairs). It is a modern JavaScript feature introduced in ECMAScript 2015.
2. **`Reduce` with an empty object (`{}`)**: This approach uses the `reduce()` method to iterate over the key-value pairs and create a new object. The initial value of the accumulator is an empty object `{}`.
3. **`Reduce` with a null object (`Object.create(null)`)**: Similar to the previous approach, but the initial value of the accumulator is a null object created using `Object.create(null)`.

**Pros and Cons**

Here's a brief analysis of each approach:

1. **`Object.fromEntries`**:
	* Pros: Modern JavaScript feature, concise syntax, efficient execution time.
	* Cons: May not be supported in older browsers or environments.
2. **`Reduce` with an empty object (`{}`)**:
	* Pros: Wide browser support, simple syntax, works well for small to medium-sized datasets.
	* Cons: May have higher overhead compared to `Object.fromEntries`, as it requires creating a new object and iterating over the key-value pairs.
3. **`Reduce` with a null object (`Object.create(null)`)**:
	* Pros: Similar performance to using an empty object, with slightly better cache locality due to the null object being created using `Object.create(null)`.
	* Cons: May have slightly higher overhead compared to using an empty object or `Object.fromEntries`.

**Library and Special Features**

There are no libraries used in this benchmark. However, it's worth noting that `Object.fromEntries` relies on a modern JavaScript feature, which may not be supported in all environments.

**Other Considerations**

When choosing between these approaches, consider the specific requirements of your project:

* If you need to support older browsers or environments, use `Reduce` with an empty object (`{}`) or `Object.create(null)`.
* If you prioritize performance and modern JavaScript features, use `Object.fromEntries`.
* If you're working on a small to medium-sized dataset, `Reduce` with an empty object (`{}`) may be sufficient.

**Alternatives**

Other alternatives for creating objects from key-value pairs include:

1. **`Object.assign()`**: This method assigns properties of source objects to a target object. However, it has higher overhead compared to `Object.fromEntries`.
2. **Manual looping**: You can use a simple loop to iterate over the key-value pairs and create a new object.
3. **Other libraries**: There are several libraries available that provide functions for creating objects from key-value pairs, such as Lodash or Underscore.js.

Keep in mind that these alternatives may have different performance characteristics and trade-offs compared to `Object.fromEntries`.

Related benchmarks:

Object.fromEntries vs reduce(fork) (version: 0)

Comparing performance of: Object.fromEntries vs Reduce (reuse object) vs Reduce (reuse object(null))

Created: 2 years ago by: Guest

Jump to the latest result

Object.fromEntries

Reduce (reuse object)

Reduce (reuse object(null))

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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