Benchmark: Object.fromEntries vs reduce - 100 keys

Script Preparation code:

var data = { ...Array.from(Array(100).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() }), {});

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)

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 131 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Object.fromEntries	52808.7 Ops/sec
Reduce (reuse object)	431260.7 Ops/sec
Reduce (creating temporary objects)	175417.5 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 3 months ago):

LLMs can make mistakes. Check important info.

The benchmark provided tests three different approaches to transforming an object whose keys are integers from 0 to 99 into a new object while converting the values to strings. The object is created using a spread operation on an array derived from a range of numbers.

### Approaches Compared

1. **Object.fromEntries with map**:
   - **Benchmark Definition**: `Object.fromEntries(Object.entries(data).map((key, value) => [key, value]));`
   - **Description**: This approach uses `Object.entries` to convert the object into an array of key-value pairs, applies a `map` function to transform these pairs (although the implementation accidentally passes `key` and `value`, which should be `[key, value]` destructured), and then converts it back to an object using `Object.fromEntries`.
   - **Pros**:
     - Concise and leverages built-in methods for clarity.
     - Expressive with the use of higher-order array functions.
   - **Cons**:
     - Performance may suffer with larger datasets due to the intermediate array created by `map`, especially since it needs to reconstruct the array on each iteration before being converted back to an object.

2. **Reduce (reuse object)**:
   - **Benchmark Definition**: `Object.entries(data).reduce((acc, [k, v]) => { acc[k] = v.toString(); return acc; }, {});`
   - **Description**: This approach uses `Object.entries` to get the key-value pairs and processes them using `reduce` to construct a new object directly by adding properties to the accumulator object `acc`.
   - **Pros**:
     - Efficient as it mutates the `acc` directly, avoiding the overhead of creating intermediate data structures.
     - Clear and straightforward in constructing the output object.
   - **Cons**:
     - Slightly less declarative than using higher-order functions like `map`, which might reduce readability for some developers.

3. **Reduce (creating temporary objects)**:
   - **Benchmark Definition**: `Object.entries(data).reduce((acc, [k, v]) => ({ ...acc, [k]: v.toString() }), {});`
   - **Description**: This approach also uses `reduce`, but creates a new copy of the accumulator object each time through the loop using spread syntax (`...acc`).
   - **Pros**:
     - Offers a functional programming style that some may find more legible.
   - **Cons**:
     - Significantly less efficient since it creates a new object on every iteration, leading to greater resource consumption, especially as input size grows.

### Benchmark Results

From the benchmark results, we see execution speeds performed across a specific browser environment:

- **Reduce (reuse object)**: 285254.56 executions/sec
- **Reduce (creating temporary objects)**: 120417.26 executions/sec
- **Object.fromEntries**: 39401.23 executions/sec

### Conclusion

- **Speed**: The results show that the most efficient method is `reduce` with a reused object. Clearly, the overhead of creating new objects impacts performance dramatically, illustrating the importance of considering memory and performance when processing large datasets.
- **Library Usage**: All tests make use of built-in JavaScript features such as `Object.entries`, `Object.fromEntries`, and the spreading syntax to construct objects. These methods are part of the core JavaScript language and improve both the readability and maintainability of the code, although their use can have varying performance implications.
- **Alternatives**: Other alternatives that might achieve similar outcomes include using `for...in` loops, `forEach`, or even manual loops implemented with `for`, which could offer different balances between clarity, expressiveness, and performance. Additionally, libraries such as Lodash provide utility functions for manipulating objects and may further enhance clarity and reusability at the cost of additional overhead.

Related benchmarks:

Object.fromEntries vs reduce - 100 keys (version: 1)

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

Created: 3 months ago by: Guest

Jump to the latest result

Object.fromEntries

Reduce (reuse object)

Reduce (creating temporary objects)

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 3 months ago):