Benchmark: fromEntries vs.reduce vs. forEach

Script Preparation code:

const CHARS = 'abcdefghijklmnopqrstuvwxyz';
const RANDOM_KEY_LENGTH = 6;
const SAMPLE_SIZE = 200;

function getRandChar() {
    return CHARS.at(Math.floor(Math.random() * CHARS.length));
}

var items = Array.from({
    length: SAMPLE_SIZE
}, (_, index) => `${index}${Array.from({ length: RANDOM_KEY_LENGTH }, getRandChar).join('')}`);

Tests:

Reduce (creating temporary objects)
const result = items.reduce((acc, [item]) => ({ ...acc, [item]: 1 }), {}); return result;
Reduce (reuse object)
const result = items.reduce((acc, item) => { acc[item] = 1; return acc; }, {}); return result;
Object.fromEntries
const result = Object.fromEntries(items.map((item) => [item, 1])); return result;
Plain
const result = {}; items.forEach((item) => { result[item] = 1; }); return result;

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Reduce (creating temporary objects)
Reduce (reuse object)
Object.fromEntries
Plain

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

I'll break down what's being tested in the provided benchmark.

The test cases are comparing different approaches for creating an object from an array of key-value pairs:

1. **Reduce**: This approach uses the `reduce()` method to create an object. There are two variations:
	* **Creating temporary objects** (`Reduce (creating temporary objects)`): The accumulator is a new object created on each iteration, and then merged into the final result.
	* **Reusing object** (`Reduce (reuse object)`): The accumulator is the same object that's being modified on each iteration. This approach can lead to issues if not done correctly, as it may cause unexpected behavior or errors.
2. **Object.fromEntries**: This method creates an object from an array of key-value pairs using the `fromEntries()` function.
3. **Plain**: This approach uses a loop to iterate over the array and manually assign values to the resulting object.

**Options comparison:**

*   The main difference between these approaches is how they handle the creation and management of objects:
    *   Reduce (creating temporary objects) creates a new object on each iteration, which can be inefficient.
    *   Reduce (reuse object) uses the same object on each iteration, but requires careful handling to avoid issues.
    *   Object.fromEntries is a built-in method that handles object creation for you and is generally efficient.
    *   Plain manually assigns values to an object, which can lead to errors if not done correctly.

**Pros and Cons:**

*   Reduce (creating temporary objects):
    *   Pros: Easy to understand and implement. Creates new objects, which might be desirable in some cases.
    *   Cons: Can be inefficient due to the creation of multiple temporary objects.
*   Reduce (reuse object):
    *   Pros: Reuses memory, which can lead to performance improvements.
    *   Cons: Requires careful handling to avoid issues and potential errors.
*   Object.fromEntries:
    *   Pros: Built-in method, efficient, and easy to understand. Eliminates the need for manual object creation.
    *   Cons: Limited control over the object's internal structure.
*   Plain:
    *   Pros: Can provide fine-grained control over the object's internal structure.
    *   Cons: Requires manual memory management, which can lead to errors.

**Library and purpose:**

*   `Object.fromEntries()`: This is a built-in method introduced in ECMAScript 2015 (ES6). It creates an object from an array of key-value pairs and is designed for simplicity and efficiency.

**Special JS feature or syntax:**

This benchmark doesn't explicitly use any special JavaScript features or syntax. However, it's essential to note that some of these methods might be affected by browser support or ES version.

**Other alternatives:**

There are alternative approaches to creating an object from an array of key-value pairs:

*   **`Array.prototype.reduce()`**: Similar to the first Reduce approach but with a different method signature.
*   **`for...of` loop and `Map` data structure**: This approach uses a loop and a Map to create an object. It's more efficient than manual assignment but still requires careful handling.

Here is some sample code for using `Array.prototype.reduce()`:
```javascript
const result = items.reduce((acc, [item]) => ({...acc, [item]: 1}), {});
return result;
```
And here is the sample code for using a `for...of` loop and a `Map` data structure:
```javascript
const map = new Map();
items.forEach((item) => {
    map.set(item, 1);
});
const result = Object.fromEntries(map);
return result;
```
Keep in mind that these alternatives are not part of the original benchmark definition but can be used to create an object from an array of key-value pairs.

Latest run results:

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

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36 Edg/126.0.0.0

Browser/OS: Chrome 126 on Windows

View result in a separate tab

Test name	Executions per second
Reduce (creating temporary objects)	52782.8 Ops/sec
Reduce (reuse object)	139551.7 Ops/sec
Object.fromEntries	75299.4 Ops/sec
Plain	118521.5 Ops/sec

Related benchmarks:

fromEntries vs.reduce vs. forEach (version: 3)

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

Created: 4 months ago by: Registered User

Jump to the latest result

Reduce (creating temporary objects)

Reduce (reuse object)

Object.fromEntries

Plain

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