Benchmark: reduce vs fromEntries

HTML Preparation code:

<!--your preparation HTML code goes here-->

Script Preparation code:

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

Tests:

Object.fromEntries
Object.fromEntries(Object.entries(data).filter(([id]) => ids.includes(id)));
Object.reduce
Object.keys(data) .filter((id) => !ids.includes(id)) .reduce((acc, id) => ({...acc, [id]: data[id]}), {})

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Object.fromEntries
Object.reduce

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 20 days ago)

User agent: Mozilla/5.0 (X11; Linux x86_64; rv:133.0) Gecko/20100101 Firefox/133.0

Browser/OS: Firefox 133 on Linux

View result in a separate tab

Test name	Executions per second
Object.fromEntries	182.6 Ops/sec
Object.reduce	0.3 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 20 days ago):

LLMs can make mistakes. Check important info.

The benchmark described in the provided JSON is comparing two different approaches for filtering and transforming a JavaScript object: using `Object.fromEntries` and using `reduce`. Both methods aim to create a new object from an existing object (`data`) while filtering out keys that are present in an array (`ids`).

### Options Compared:

1. **Object.fromEntries with filtering**:
   - **Benchmark Definition**: `Object.fromEntries(Object.entries(data).filter(([id]) => ids.includes(id)));`
   - **Description**: This method first converts the object `data` into an array of key-value pairs (each pair being an array of two elements). It then filters these pairs based on whether the key exists in the `ids` array. Finally, it converts the filtered array back into an object using `Object.fromEntries`.
   - **Pros**:
     - More declarative: It makes the intent clear by showing the transformation step-by-step (conversion to entries, filtering, and reconstruction).
     - Easier to read and maintain for developers familiar with array methods.
   - **Cons**:
     - May be less performant for very large datasets due to the overhead of creating multiple intermediate data structures (arrays of entries, filtered arrays).

2. **Object.keys with filter and reduce**:
   - **Benchmark Definition**: `Object.keys(data).filter((id) => !ids.includes(id)).reduce((acc, id) => ({...acc, [id]: data[id]}), {});`
   - **Description**: In this approach, it first retrieves all keys of the `data` object using `Object.keys`. It then filters out the keys that are included in the `ids` array. Finally, it uses `reduce` to construct a new object by accumulating key-value pairs.
   - **Pros**:
     - Potentially shifts performance characteristics since it avoids creating an array of entries.
     - Using `reduce` may be preferable for certain functional programming styles where immutability is favored.
   - **Cons**:
     - More verbose and arguably less readable, especially for those who may not be as familiar with reduce.
     - The spread syntax within `reduce` can be performance-intensive, as it creates a new object for every iteration, leading to more memory allocation.

### Library and Features:

- **No external libraries are used** in this benchmark. Both methods utilize built-in JavaScript functionalities and native APIs, such as `Object.entries`, `Object.fromEntries`, `Object.keys`, `Array.prototype.filter`, and `Array.prototype.reduce`.

### JavaScript Features:

- **`Object.entries()`**: This method returns an array of a given object's own enumerable string-keyed property [key, value] pairs. This is crucial for the first benchmark because it directly prepares an array suitable for filtering.
- **`Object.fromEntries()`**: This method transforms a list of [key, value] pairs back into an object. It simplifies the reconstruction of objects after filtering operations.
- **`Array.prototype.filter()`**: A method that creates a new array with all elements that pass the test implemented by the provided function.
- **`Array.prototype.reduce()`**: A method that executes a reducer function on each element of the array, resulting in a single output value.

### Benchmark Results:

The benchmark results show that:
- **Object.fromEntries** achieved around **182.60 executions per second**.
- **Object.reduce** achieved around **0.27 executions per second**.

This indicates a significant performance advantage for the `Object.fromEntries` approach, demonstrating that it is far more efficient for the specific case tested here.

### Other Alternatives:

Some alternative approaches to consider when filtering from an object in JavaScript could include:

1. **Using for..in Loop**:
   - A manual iteration over the object properties, using a simple conditional check to build a new object.
   - Pros: Straightforward and may offer better performance due to less overhead.
   - Cons: Slightly less functional and requires more manual handling of the object.

2. **Using Frameworks or Libraries**:
   - Libraries like Lodash or Underscore.js can provide utility functions for deep object manipulation that can sometimes be more performant.
   - Pros: More built-in functionality and utility methods.
   - Cons: Added dependency overhead.

3. **Immutable.js or similar**:
   - Using immutable data structures can often enhance performance due to structural sharing and efficient operations.
   - Pros: Designed for high-performance functional programming.
   - Cons: Steeper learning curve and more complex setup compared to plain JavaScript.

In summary, when choosing between the methods tested in this benchmark, the `Object.fromEntries` approach is superior in terms of performance and clarity for this specific task. However, understanding the pros and cons of both approaches is crucial for making informed decisions based on context and requirements.

Related benchmarks:

reduce vs fromEntries (version: 1)

reduce vs fromEntries

Comparing performance of: Object.fromEntries vs Object.reduce

Created: 20 days ago by: Guest

Jump to the latest result

Object.fromEntries

Object.reduce

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 20 days ago):