Benchmark: Object reading JS

HTML Preparation code:

<div id="show"></div>

Script Preparation code:

var obj = {}
var maxsize = 100

for (let i = 0; i < maxsize; i++) {
  obj[`i_${i}`] = i;
}

Tests:

for in
let total = 0; for (let k in obj) { const test = obj[k] + 1; total += test; }
for classic
let total = 0; const keys = Object.keys(obj) for (let i = 0; i < maxsize; i++) { const test = obj[keys[i]] + 1; total += test; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for in
for classic

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; rv:100.0) Gecko/20100101 Firefox/100.0

Browser/OS: Firefox 100 on Mac OS X 10.15

View result in a separate tab

Test name	Executions per second
for in	521473.2 Ops/sec
for classic	366704.1 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the benchmark test case and explain what is being tested.

**Benchmark Overview**

The benchmark measures the performance of two different ways to iterate over an object in JavaScript: using the `for...in` loop and using the `Object.keys()` method.

**Test Case 1: "for in"**

This test case uses the `for...in` loop to iterate over the properties of the `obj` object. The code is:

```javascript
for (let k in obj) {
  const test = obj[k] + 1;
  total += test;
}
```

**Test Case 2: "for classic"**

This test case uses the `Object.keys()` method to get an array of the object's property names, and then iterates over that array using a traditional `for` loop. The code is:

```javascript
const keys = Object.keys(obj);

for (let i = 0; i < maxsize; i++) {
  const test = obj[keys[i]] + 1;
  total += test;
}
```

**Comparison of Approaches**

Here are some pros and cons of each approach:

* **For...in loop**:
	+ Pros: Simple and straightforward, no need to import additional libraries.
	+ Cons: Can be slower due to the overhead of iterating over property names, not just values. Also, can skip some properties if they are not enumerable (e.g., inherited properties).
* **Object.keys() method**:
	+ Pros: More efficient and predictable than `for...in`, as it only iterates over enumerable properties.
	+ Cons: Requires importing the `Object` library, which may add overhead.

**Other Considerations**

Both approaches have some additional considerations:

* **Property lookup**: In both cases, the code uses property lookup (`obj[k]` or `obj[keys[i]]`) to access the object's values. This can be slower than a simple value lookup if the objects are very large.
* **Cache locality**: The order of iteration may affect cache locality, which can impact performance.

**Library and Special Features**

In this benchmark, there is no specific library used that requires special features or syntax. However, it's worth noting that `Object.keys()` was introduced in ECMAScript 5 (ES5) and became widely supported in modern browsers.

**Alternative Approaches**

Other alternative approaches to iterating over objects could include:

* **Using `forEach()`**: This method is available on arrays and can be used to iterate over object values.
* **Using a `for...of` loop**: If you need to iterate over the object's properties, you could use a `for...of` loop with an iterator.
* **Using a custom iterator**: You could create a custom iterator to iterate over the object's properties.

Keep in mind that these alternatives may have different performance characteristics and might not be as efficient as using `Object.keys()` or traditional loops.

Related benchmarks:

Object reading JS (version: 0)

Comparing performance of: for in vs for classic

Created: 2 years ago by: Guest

Jump to the latest result

for in

for classic

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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