Benchmark: for..of against Map.entries vs for..in

Script Preparation code:

var array = Array.from({ length: 10000 }, () => {
  const n = Math.floor(Math.random() * 100)
  if (n > 26) {
    return n
  } else {
    return String.fromCharCode('a'.charCodeAt(0) + n);
  }
});
var obj = new Map();
for (let i = 0; i < array.length; i++) {
  obj.set(i, array[i]);
}

Tests:

for..of Object.entries()
for (const [key, val] of obj.entries()) { const foo = val + 'a'; }
for..in
for (const key in obj.entries()) { const val = obj[key]; const foo = val + 'a'; }
for..of Object.entries() no destructuring
for (const entry of obj.entries()) { const key = entry[0]; const val = entry[1]; const foo = val + 'a'; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for..of Object.entries()
for..in
for..of Object.entries() no destructuring

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Measuring JavaScript performance is crucial for optimizing code and ensuring scalability.

**Benchmark Overview**

The provided benchmark compares three ways to iterate over the entries of a Map object in JavaScript: using `Object.entries()`, `for...in`, and `for...of` with destructuring. The benchmark consists of creating a large array of random characters and mapping it to a Map, then iterating over each entry.

**Options Compared**

1. **For...of Object.entries()**: This method uses the `entries()` method to get an iterator over the entries of the Map object. It's a modern way to iterate over objects in JavaScript.
2. **For...in**: This is an older way to iterate over the properties (including keys and values) of an object. However, it can be slower than other methods because it iterates over the object's prototype chain as well.
3. **For...of Object.entries() no destructuring**: Similar to the first option, but without deconstructing the iterator into separate variables for the key and value.

**Pros and Cons of Each Approach**

1. **For...of Object.entries()**:
	* Pros: Modern, efficient, and readable.
	* Cons: Requires JavaScript 13+ or ECMAScript 2018+ support.
2. **For...in**:
	* Pros: Widely supported across browsers and Node.js versions.
	* Cons: Can be slower due to the prototype chain iteration, and it's less readable than other methods.
3. **For...of Object.entries() no destructuring**:
	* Pros: Similar performance to the first option, but with a slightly more traditional syntax.
	* Cons: Requires JavaScript 13+ or ECMAScript 2018+ support.

**Library/Functionality**

The benchmark uses the built-in `Map` object in JavaScript, which is implemented by most browsers and Node.js versions. The `Array.from()` method is also used to create a large array of random characters.

**Special JS Feature/Syntax**

There is no special JavaScript feature or syntax used in this benchmark that would require explanation.

**Other Considerations**

When working with Maps in JavaScript, it's essential to consider the following:

* Map performance can vary depending on the size of the map and the browser/Node.js version.
* Using `Object.entries()` is generally faster than using `for...in` or other methods.
* When iterating over a large number of entries, consider using `for...of Object.entries()` with deconstruction for optimal performance.

**Alternatives**

Other alternatives to measure JavaScript performance include:

1. **Benchmarking libraries**: Such as Benchmark.js or micro-benchmark, which provide more advanced features and customization options.
2. **Browser-specific benchmarks**: Such as Chrome's own benchmarking tools or Mozilla's Browser Benchmarks.
3. **Node.js built-in benchmarks**: Such as the `benchmark` module in Node.js.

Keep in mind that different benchmarks may produce varying results due to differences in implementation, testing conditions, and browser/Node.js versions.

Latest run results:

Run details: (Test run date: 3 years ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.96 Safari/537.36 Edg/88.0.705.56

Browser/OS: Chrome 88 on Mac OS X 10.15.5

View result in a separate tab

Test name	Executions per second
for..of Object.entries()	3368.4 Ops/sec
for..in	10594059.0 Ops/sec
for..of Object.entries() no destructuring	3715.6 Ops/sec

Related benchmarks:

for..of against Map.entries vs for..in (version: 0)

Comparing performance of: for..of Object.entries() vs for..in vs for..of Object.entries() no destructuring

Created: 3 years ago by: Guest

Jump to the latest result

for..of Object.entries()

for..in

for..of Object.entries() no destructuring

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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