Benchmark: k-v Array to Obj

Script Preparation code:

var arr = Array.from(Array(10000), (x,i) => [i,i]);

Tests:

Object.fromEntries
Object.fromEntries(arr);
Reduce (same obj)
arr .reduce((acc,[k,v]) => { acc[k] = v; return acc }, {})
Reduce (new obj)
arr .reduce((acc,[k,v]) => ({...acc, [k]: v}), {})

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Object.fromEntries
Reduce (same obj)
Reduce (new obj)

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

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

Browser/OS: Chrome 124 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Object.fromEntries	2891.6 Ops/sec
Reduce (same obj)	15798.3 Ops/sec
Reduce (new obj)	100.1 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what's being tested, the different approaches compared, their pros and cons, and other considerations.

**Benchmark Definition**

The benchmark definition represents a JavaScript function that creates an object from a key-value array. The three test cases use different methods to achieve this:

1. `Object.fromEntries(arr);`
2. `arr.reduce((acc,[k,v]) => { acc[k] = v; return acc; }, {});`
3. `arr.reduce((acc,[k,v]) => ({...acc, [k]: v}), {});`

**Options Compared**

These three approaches are compared in terms of performance, which is the primary focus of this benchmark.

* **`Object.fromEntries(arr)`**: This method creates a new object from an array of key-value pairs using `Object.fromEntries()`. It's a modern JavaScript feature introduced in ECMAScript 2019.
* **`arr.reduce((acc,[k,v]) => { acc[k] = v; return acc; }, {})`**: This approach uses the `reduce()` method to iterate over the array and assign values to an accumulator object. The accumulator is initialized with an empty object (`{}`).
* **`arr.reduce((acc,[k,v]) => ({...acc, [k]: v}), {})`**: Similar to the previous approach, but instead of using the accumulator's existing properties, a new object is created for each iteration.

**Pros and Cons**

* **`Object.fromEntries(arr)`**:
	+ Pros: Short and concise syntax, efficient performance.
	+ Cons: Only supported in ECMAScript 2019 and later versions. Requires no browser-specific polyfills.
* **`arr.reduce((acc,[k,v]) => { acc[k] = v; return acc; }, {})`**:
	+ Pros: Widely supported across browsers and older JavaScript versions. Can be used for other array processing tasks.
	+ Cons: More verbose syntax, potentially slower performance due to object property assignment.
* **`arr.reduce((acc,[k,v]) => ({...acc, [k]: v}), {})`**:
	+ Pros: Similar to the previous approach but with a slightly more concise syntax. Still widely supported across browsers and older JavaScript versions.
	+ Cons: Slightly slower performance compared to `Object.fromEntries()`. Requires object literal syntax.

**Other Considerations**

* **Library usage**: None of these approaches rely on external libraries or frameworks. They are built-in JavaScript methods or syntax features.
* **Special JS features**: Only the first approach (`Object.fromEntries(arr)`) utilizes a modern JavaScript feature, while the other two approaches use standard `reduce()` method.
* **Browser and device specifics**: The benchmark results show differences in performance across various browsers (Chrome 124) and devices (Desktop). However, these variations are likely due to factors like caching, browser-specific optimizations, or differences in system resources.

**Alternatives**

Other alternatives for creating an object from a key-value array include:

* Using `Array.prototype.forEach()` with callback functions
* Implementing a custom function using `Array.prototype.map()`, `Array.prototype.filter()`, and object literal syntax

Keep in mind that these alternatives may not be as efficient or concise as the methods tested in this benchmark.

Related benchmarks:

k-v Array to Obj (version: 0)

Comparing performance of: Object.fromEntries vs Reduce (same obj) vs Reduce (new obj)

Created: one year ago by: Registered User

Jump to the latest result

Object.fromEntries

Reduce (same obj)

Reduce (new obj)

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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