Benchmark: Reduce vs Map+FromEntries vs for loop vs forof loop vd

Script Preparation code:

var data = Object.fromEntries(Array.from(Array(10000).keys()).map((v, k) => [k, v]));

Tests:

reduce mutating acc
Object.entries(data).reduce((acc, [k, v]) => { acc[k] = v.toString(); return acc; }, {});
map + fromEntries
Object.fromEntries(Object.entries(data).map(([k, v]) => ([k, v.toString()])));
for loop
const dataObject = Object.entries(data) const acc = {} for (let i = 0; i < dataObject.length; i++) { const [k, v] = dataObject[i]; acc[k] = v.toString() }
forof loop
const dataObject = Object.entries(data) const acc = {} for (const [k,v] of dataObject) { acc[k] = v.toString() }
forin loop
const acc = {} for (const property in data) { if (data.hasOwnProperty(property)){ acc[property] = data[property].toString(); } }
reduce without mutating acc
Object.entries(data).reduce((acc, [k, v]) => { return { ...acc, [k]: v.toString() }; }, {});
.forEach
const acc = {}; Object.entries(data).forEach(([k, v]) => { acc[k] = v.toString(); });

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
reduce mutating acc
map + fromEntries
for loop
forof loop
forin loop
reduce without mutating acc
.forEach

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 2 years ago)

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

Browser/OS: Chrome 122 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
reduce mutating acc	1386.5 Ops/sec
map + fromEntries	753.5 Ops/sec
for loop	1529.4 Ops/sec
forof loop	1532.4 Ops/sec
forin loop	652.9 Ops/sec
reduce without mutating acc	48.9 Ops/sec
.forEach	1500.3 Ops/sec

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

LLMs can make mistakes. Check important info.

The provided JSON represents a set of benchmarks for testing different approaches to converting an object's entries to a string in JavaScript.

**Options Compared**

The benchmark compares six different approaches:

1. `forof loop`: Using the `for...of` loop to iterate over the object's entries and assign values to a new object.
2. `for loop`: Using a traditional `for` loop with an index variable to iterate over the object's entries and assign values to a new object.
3. `.forEach` ( Array.prototype.forEach ): Using the `.forEach` method on the array of object entries to iterate and assign values to a new object.
4. `map + fromEntries`: Using the `Array.fromEntries` method, which converts an iterable into an array of key-value pairs, followed by the `map` method to convert each value to a string, and finally `Object.fromEntries` to create a new object from the resulting array of key-value pairs.
5. Reduce with mutating accumulator (`reduce`): Using the `Array.prototype.reduce` method to iterate over the object's entries and accumulate values in an accumulator object.
6. Reduce without mutating accumulator (`reduce without mutating acc`): Similar to the previous approach, but returns a new object instead of modifying the existing one.

**Pros and Cons**

Here are some pros and cons for each approach:

* `forof loop`: Pros - concise and easy to read; Cons - may not be as well-supported in older browsers or non-iterable objects. Performance is generally good.
* `for loop`: Pros - widely supported, can be optimized with arrays; Cons - more verbose than `forof` or `.forEach`, potential for errors due to indexing issues.
* `.forEach` ( Array.prototype.forEach ): Pros - concise and easy to read; Cons - may not be as performant as other methods, potential issues with asynchronous execution.
* `map + fromEntries`: Pros - combines multiple operations into one step; Cons - may have performance implications due to unnecessary array creation.
* Reduce with mutating accumulator (`reduce`): Pros - efficient for large datasets; Cons - modifies the original object and can lead to unexpected side effects.
* Reduce without mutating accumulator (`reduce without mutating acc`): Pros - safe from modifying the original object; Cons - may be slower than mutating the accumulator.

**Other Considerations**

When choosing a method, consider:

* Performance: `forof loop`, `for loop`, and `.forEach` are generally similar in performance, while `map + fromEntries` might incur additional overhead. Reduce methods with mutating or non-mutating accumulators have different implications.
* Code readability: `forof` loops and `.forEach` methods can be more concise, while traditional `for` loops require more boilerplate code.
* Browser support: Some older browsers may not support `for...of` or `.forEach`, which might affect compatibility.

**Best Practices**

1. Use `forof loop` when iterating over iterable objects, as it is the most readable and efficient way to iterate.
2. For performance-critical code, consider using Reduce methods with non-mutating accumulators (`reduce without mutating acc`) for safety and predictability.
3. For simplicity and conciseness, use `.forEach` or `map + fromEntries`, but be aware of potential performance implications.

Ultimately, the choice of method depends on your specific requirements, trade-offs between readability, performance, and compatibility.

Related benchmarks:

Reduce vs Map+FromEntries vs for loop vs forof loop vd (version: 0)

Comparing performance of: reduce mutating acc vs map + fromEntries vs for loop vs forof loop vs forin loop vs reduce without mutating acc vs .forEach

Created: 2 years ago by: Guest

Jump to the latest result

reduce mutating acc

map + fromEntries

for loop

forof loop

forin loop

reduce without mutating acc

.forEach

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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