Benchmark: My: Object.entries vs For In (size: 100000) B

Script Preparation code:

var ns = [100000];
var results = Array(ns.length); // 1.000 -> 10.000 -> 100.000 -> 1.000.000 -> 10.000.000
ns.forEach((n, i) => {
    results[i] = [...Array(n).keys()].reduce((acc, c) => {
        acc['k_' + String(c).padStart(10, '0')] = Math.random();
        return acc;
    }, {});
});
let sum = 0;

Tests:

Object.entries
sum = 0; Object.entries(results[0]).forEach(([k, v]) => sum += results[0][k]);
For In
sum = 0; for (const k in results[0]) { sum += results[0][k] }
For Of Object.entries
sum = 0; for (const [k, v] of Object.entries(results[0])) { sum += v }
For Of Object.keys
sum = 0; for (const k of Object.keys(results[0])) { sum += results[0][k] }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Object.entries
For In
For Of Object.entries
For Of Object.keys

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/127.0.0.0 Safari/537.36

Browser/OS: Chrome 127 on Linux

View result in a separate tab

Test name	Executions per second
Object.entries	22.5 Ops/sec
For In	39.3 Ops/sec
For Of Object.entries	27.8 Ops/sec
For Of Object.keys	38.6 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the details of this JavaScript microbenchmark.

**Benchmark Purpose**

The benchmark compares the performance of four different approaches to iterate over objects in JavaScript:

1. `for...in` (also known as "traditional for loop")
2. `For Of Object.keys`
3. `For Of Object.entries`

These approaches are compared on a large dataset, where each entry is an object with a random property-value pair.

**Approach 1: `for...in`**

The `for...in` loop iterates over the properties of an object using the property name as the loop variable. However, in modern JavaScript, this approach has some caveats:

* It returns both inherited and own properties of the object.
* The order of iteration is not guaranteed to be alphabetical.

In the benchmark script, `for...in` is used to iterate over the keys of the first entry in the `results` array. However, since each entry is an object with a random property name, this approach may not always access the expected properties.

**Approach 2: `For Of Object.keys`**

The `For Of` loop is a newer syntax that allows iterating over arrays or objects using a more modern and expressive way. The `Object.keys()` method returns an array of strings representing the property names of an object. In this benchmark, `For Of Object.keys` is used to iterate over the keys of each entry in the `results` array.

**Approach 3: `For Of Object.entries`**

Similar to `For Of Object.keys`, but instead of accessing only the property names, `Object.entries()` returns an array of tuples containing both the key and value of each property. In this benchmark, `For Of Object.entries` is used to iterate over the entries of each object in the `results` array.

**Approach 4: `for...in` with bracket notation**

In this approach, `for...in` is used as before, but instead of using a loop variable, it uses bracket notation (`[]`) to access the properties. This approach avoids some of the issues associated with traditional `for...in`.

**Pros and Cons**

Here are some pros and cons of each approach:

* `For Of Object.keys`:
	+ Pros: Modern syntax, expressive way of iterating over property names.
	+ Cons: May not be supported in older browsers or environments.
* `For Of Object.entries`:
	+ Pros: Access to both key-value pairs, modern syntax.
	+ Cons: May be slower due to the additional lookup required for the value.
* `for...in` with bracket notation:
	+ Pros: Avoids some of the issues associated with traditional `for...in`, still uses array-like indexing.
	+ Cons: Still returns both inherited and own properties, may not always access expected properties.

**Library**

None

**Special JS Features/Syntax**

The benchmark uses modern JavaScript features such as:

* Arrow functions (`ns.forEach((n, i) => {...})`)
* Template literals (`String(c).padStart(10, '0')`)
* Bracket notation (`[]`)

However, it does not use any special JavaScript features that are specific to a particular browser or engine.

**Other Alternatives**

If you want to benchmark other approaches to iterating over objects in JavaScript, here are some alternatives:

* `for...in` with a loop variable
* Using a library like Lodash's `_.forEachObject()`
* Using a library like Underscore.js's `_each()`

Related benchmarks:

My: Object.entries vs For In (size: 100000) B (version: 2)

Comparing performance of: Object.entries vs For In vs For Of Object.entries vs For Of Object.keys

Created: one year ago by: Registered User

Jump to the latest result

Object.entries

For In

For Of Object.entries

For Of Object.keys

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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