Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Object.fromEntries vs reduce vs classic for v3
(version: 1)
Comparing performance of:
Object.fromEntries vs Reduce (reuse object) vs For
Created:
one year ago
by:
Guest
Go to the latest result
Script Preparation code:
const data = Array.from(Array(10000).keys());
Tests:
Object.fromEntries
Object.fromEntries(data.map((idx) => [`id-${idx}`, idx]));
Reduce (reuse object)
data.reduce((acc, idx) => { acc[`id-${idx}`] = idx; return acc; }, {});
For
const a = {} for (let idx of data) { a[`id-${idx}`] = idx; }
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
Object.fromEntries
Reduce (reuse object)
For
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/147.0.0.0 Safari/537.36 Edg/147.0.0.0
Browser/OS:
Chrome 147 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=627664" width="100%" height="500px"></iframe>
For
1K/s
Reduce (reuse object)
1K/s
Object.fromEntries
750/s
View exact numbers
Test name
Executions per second
✓
For
1,273 Ops/sec
Reduce (reuse object)
1,162 Ops/sec
Object.fromEntries
750 Ops/sec
Autogenerated LLM Summary
(model
gpt-4o-mini
, generated one year ago):
The benchmark you provided compares three different methods for creating an object from an array of integers ranging from 0 to 9999. The methods being compared are: 1. **Using `Object.fromEntries`**: This method leverages the `Object.fromEntries()` function, which takes an iterable of key-value pairs (in this case, generated using `data.map()`) and converts it into an object. 2. **Using `reduce`**: This method utilizes the `reduce()` array method to iterate over the `data` array. It accumulates the key-value pairs into an object, effectively building it up as it iterates. 3. **Using a classic `for` loop**: This method employs a traditional `for` loop to iterate over the `data` array and directly assigns key-value pairs to an object. ### Performance Results From the benchmark results: - **For Loop**: 736.25 executions per second - **Reduce (Reuse Object)**: 711.06 executions per second - **Object.fromEntries**: 524.42 executions per second ### Pros and Cons of Each Approach 1. **Object.fromEntries**: - **Pros**: - Concise and clear syntax. - Directly expresses the intent of converting pairs into an object. - **Cons**: - Performance is slower compared to other methods. - Can be less familiar to those who are not accustomed to functional programming styles in JavaScript. 2. **Reduce**: - **Pros**: - More functional in style, which may appeal to developers with a background in functional programming. - Avoids the need for a separate variable for accumulation (as the accumulator is passed into the function). - **Cons**: - Slightly harder to read and understand, especially for those unfamiliar with `reduce`. - Potential for reduced performance compared to simple loops, especially with large datasets. 3. **For Loop**: - **Pros**: - Traditional and easily understood by all developers. - Tends to have better performance in JavaScript engines, as it minimizes the abstraction overhead. - **Cons**: - More verbose and less modern in appearance; can lead to more boilerplate code. - Less declarative than the other methods, which can lead to a misunderstanding if not documented well. ### Other Considerations - **Readability**: For future maintainers of the code, readability is crucial. While concise methods like `Object.fromEntries` and `reduce` offer clarity in intent, they can sometimes obfuscate performance implications. - **Browser Differences**: The performance of these methods can vary across different JavaScript engines; thus, benchmarking in the target environment is essential. - **Array Size**: The benchmark runs with 10,000 items; performance may differ with smaller or larger datasets. ### Alternatives - **Using `Map`**: Instead of using plain objects, one could utilize a `Map` for key-value storage, which allows for a collection of key-value pairs where keys can be of any type. The `Map` can be converted to an object afterward if needed. - **Object.entries with forEach**: Another approach could involve using `Object.entries` along with `forEach`, although this also has potential performance drawbacks due to the overhead of extra method calls. ### Special Features/JS Syntax There are no specific advanced JavaScript syntaxes or features being tested in this benchmark; all methods used are standard JavaScript capabilities available in ES6 and later. The `map()` and `reduce()` methods are part of the Array prototype and are widely used for functional programming within JavaScript.
Related benchmarks
Object.fromEntries vs reduce vs for
Object.fromEntries vs reduce v21
Object.fromEntries vs reduce vs for loop
Object.fromEntries vs reduce vs Map vs for of vs forEach
Object.fromEntries vs reduce vs classic for2
Comments
Confirm delete:
Do you really want to delete benchmark?