Benchmark: Object.entries + reduce VS Object.keys + forEach

Script Preparation code:

window.obj = {
    a: 1,
    b: 2,
    c: 3,
    d: 4,
    e: 5,
}

Tests:

Object.entries + reduce
Object.entries(obj).reduce((acc, [k, v]) => acc[k] = v, {});
Object.keys + forEach
const newObj = {}; Object.keys(obj).forEach((k) => newObj[k] = obj[k]);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Object.entries + reduce
Object.keys + forEach

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 131 on Windows

View result in a separate tab

Test name	Executions per second
Object.entries + reduce	543498.8 Ops/sec
Object.keys + forEach	10494591.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the benchmark.

The provided JSON represents a JavaScript microbenchmark test case that compares two approaches to iterate over object keys and values: `Object.entries` with `reduce`, and `Object.keys` with `forEach`.

**Approaches being compared:**

1. **Object.entries + reduce**: This approach uses the `Object.entries()` method to get an array of key-value pairs, and then applies the `reduce()` method to iterate over the array. The `reduce()` method takes a callback function that receives the accumulator (`acc`) and the current element (`[k, v]`) as arguments.
2. **Object.keys + forEach**: This approach uses the `Object.keys()` method to get an array of keys, and then applies the `forEach()` method to iterate over the array.

**Pros and cons of each approach:**

1. **Object.entries + reduce**:
	* Pros:
		+ More concise and expressive code.
		+ Can be more efficient since it avoids the need to create a separate array of keys.
	* Cons:
		+ Requires understanding of the `reduce()` method and its callback function.
		+ May not be as readable for developers who are not familiar with functional programming concepts.
2. **Object.keys + forEach**:
	* Pros:
		+ More readable and intuitive code.
		+ Easier to understand and maintain, especially for developers without prior experience with functional programming.
	* Cons:
		+ Creates a separate array of keys, which can be memory-intensive for large objects.

**Library/Functionality used:**

None. These two approaches only use built-in JavaScript methods (`Object.entries()`, `Object.keys()`, and the `reduce()` method).

**Special JS feature/syntax:** None mentioned in the provided JSON.

The benchmark is designed to compare the performance of these two approaches on different browsers and devices, allowing users to determine which one performs better for their specific use case.

**Other alternatives:**

There are other ways to iterate over object keys and values in JavaScript, such as:

1. Using `for...in` loop:
```javascript
for (var key in obj) {
  var value = obj[key];
  // ...
}
```
2. Using a `while` loop with an index variable:
```javascript
var i = 0;
while (i < Object.keys(obj).length) {
  var key = Object.keys(obj)[i];
  var value = obj[key];
  // ...
  i++;
}
```
However, these approaches are generally considered less efficient and more verbose than the two methods being compared in this benchmark.

Related benchmarks:

Object.entries + reduce VS Object.keys + forEach (version: 0)

Iterate over object keys & values

Comparing performance of: Object.entries + reduce vs Object.keys + forEach

Created: 3 years ago by: Guest

Jump to the latest result

Object.entries + reduce

Object.keys + forEach

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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