Benchmark: Object.fromEntries vs reduce

Script Preparation code:

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

Tests:

Object.fromEntries
Object.fromEntries(data.map((key) => ([key, key])));
Reduce (reuse object)
data.reduce((acc, k) => { acc[k] = k.toString(); return acc; }, {});

Historical Performance Data aggregated from 6 community runs

Desktop Results:

Chrome 6 runs

Reduce (reuse object)

10K/s

Object.fromEntries

3K/s

Fastest: Reduce (reuse object) (2.9x faster)

View exact numbers

✓ Reduce (reuse object): 9,925 ops/sec
• Object.fromEntries: 3,411 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

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

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

Browser/OS: Chrome 139 on Mac OS X 10.15.7

View result in a separate tab

Reduce (reuse object)

12K/s

Object.fromEntries

4K/s

View exact numbers

Test name	Executions per second
✓ Reduce (reuse object)	12,281 Ops/sec
Object.fromEntries	4,148 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated one year ago):

LLMs can make mistakes. Check important info.

The provided benchmark tests two different approaches for converting an array of keys into an object, specifically using JavaScript. The two methods being compared are:

1. **Using `Object.fromEntries`**: 
   - **Benchmark Definition**: `Object.fromEntries(data.map((key) => ([key, key])));`
   - **Explanation**: This method first transforms the array of keys into an array of key-value pairs using `map`, which creates tuples in the format `[key, key]`, and then converts the array of tuples into an object with `Object.fromEntries`. This built-in function is highly optimized and intends to simplify the conversion process in a readable manner.

2. **Using `reduce`**:
   - **Benchmark Definition**: `data.reduce((acc, k) => {\r\n  acc[k] = k.toString();\r\n  return acc;\r\n}, {});`
   - **Explanation**: In this approach, `reduce` is employed to iterate over the array, accumulating an object (`acc`) where each key is transformed (in this case, represented as a string). The final object is constructed incrementally by updating the accumulator throughout the array traversal.

### Pros and Cons

**Object.fromEntries**:
- **Pros**:
  - Simplifies code and improves readability as it expresses the intention directly.
  - Built-in functionality may offer better performance optimizations under the hood in modern JavaScript engines due to its more specialized internal handling.
- **Cons**:
  - It might not be supported in older browsers, limiting its applicability in legacy systems (although it is widely supported in current versions of major browsers).

**Reduce**:
- **Pros**:
  - Provides more control over the accumulation process, making it flexible for more complex transformations if needed.
  - Universally supported across all environments where JavaScript runs, making it a safer choice when compatibility is critical.
- **Cons**:
  - The code is longer and potentially less straightforward, which can hinder readability.
  - May be less performant compared to `Object.fromEntries`, especially in large datasets, as it requires manual handling of object manipulation.

### Benchmark Results

From the benchmark results, we observe:
- The `Reduce (reuse object)` method achieved approximately **12,281 Executions Per Second**.
- The `Object.fromEntries` method achieved approximately **4,148 Executions Per Second**.

### Considerations

When deciding which method to use, the choice between `Object.fromEntries` and `reduce` may boil down to:
- Preference for code readability versus performance.
- The complexity of the transformation at hand (if only a straightforward key-value mapping is needed, `Object.fromEntries` is often preferable).
- Browser compatibility considerations — older environments may necessitate using `reduce`.

### Alternatives

There are other ways to accomplish the same task in JavaScript, such as:

- **For-Of Loop**:
```javascript
const obj = {};
for (const key of data) {
    obj[key] = key.toString();
}
```
This approach is explicit and arguably clear, though it doesn't take advantage of JavaScript's functional programming utilities.

- **Using `forEach`**:
```javascript
const obj = {};
data.forEach(key => {
    obj[key] = key.toString();
});
```
This still resembles the imperative style and might be less performant than `reduce` and `Object.fromEntries`.

In conclusion, this benchmark indicates a trade-off between complexity, readability, and performance. Understanding these options is crucial for software engineers to make informed decisions based on the particular context of their application.

Object.fromEntries vs reduce (version: 1)

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

Created: one year ago by: Guest

Go to the latest result

Object.fromEntries

Reduce (reuse object)

Historical Performance Data aggregated from 6 community runs

Desktop Results:

Chrome 6 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated one year ago):

Object.fromEntries vs reduce (version: 1)

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

Created: one year ago by: Guest

Go to the latest result

Object.fromEntries

Reduce (reuse object)

Historical Performance Data aggregated from 6 community runs

Desktop Results:

Chrome 6 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated one year ago):

Related benchmarks

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