Benchmark: Obj vs map for in vs for of

HTML Preparation code:

<script>
function randomString()
{
    var text = "";
    var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";

    for( var i=0; i < 5; i++ )
        text += possible.charAt(Math.floor(Math.random() * possible.length));

    return text;
}

var preComputedRandomKeys = [];
var preComputedRandomVals = [];

for (var i=0; i < 1000; i++) {
   preComputedRandomKeys[i] = randomString();
   preComputedRandomVals[i] = randomString();
}
</script>

Script Preparation code:

var map = new Map();
var obj = {};

var map2 = new Map();
var obj2 = {};

for (var i=0; i < 1000; i++) {
   map2.set(preComputedRandomKeys[i], preComputedRandomVals[i]);
   obj2[preComputedRandomKeys[i]] = preComputedRandomVals[i];
}

Tests:

map for of
for (var valit of map2) { var val = valit; }
obj for in
var key; for (key in obj2) { var val = obj2[key]; }
map for of kyes
for (var key in map2) { var val = map2.get(key); }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
map for of
obj for in
map for of kyes

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

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

LLMs can make mistakes. Check important info.

I'd be happy to help explain what's being tested on the provided JSON and offer insights into the different approaches compared.

**Benchmark Overview**

The benchmark measures the performance of three different iteration methods:

1. `for...of` with an iterator object (map).
2. `for...in` with an object.
3. `for...in` with a map.

These methods are being tested for iterating over a collection of keys and values, with the specific use case being storing 1000 key-value pairs in each data structure.

**Options Compared**

The three options compared are:

1. **Map `for...of`**: Iterating directly over the keys of the map using `for...of`.
2. **Object `for...in`**: Iterating over the properties (keys) of an object using `for...in`.
3. **Map `for...in` with key retrieval**: Iterating over the keys of a map and then retrieving the corresponding values using `map.get()`.

**Pros and Cons**

1. **Map `for...of`**:
	* Pros: More concise, more intuitive, and arguably more efficient since it avoids the overhead of iterating over keys.
	* Cons: May not be supported in older browsers or environments.
2. **Object `for...in`**:
	* Pros: Wide browser support, but may require additional steps to retrieve values (e.g., using `obj[key]`).
	* Cons: Less intuitive, potentially slower due to the extra step of retrieving values.
3. **Map `for...in` with key retrieval**:
	* Pros: Combines the benefits of both approaches, allowing for direct iteration over keys while also providing a way to retrieve values.
	* Cons: May be slightly slower than the map `for...of` option due to the additional step of retrieving values.

**Library and Syntax**

The benchmark utilizes the `Map` data structure, which is a built-in JavaScript object introduced in ECMAScript 2015 (ES6). The `Map` data structure allows for efficient key-value storage and iteration using the `for...of` iterator or the `for...in` property.

**Special JS Feature/Syntax**

The benchmark takes advantage of the `for...of` loop with an iterator object, which is a relatively new feature introduced in ECMAScript 2015 (ES6). This syntax allows for concise and expressive iteration over collections without requiring additional loops or functions.

**Other Alternatives**

If you need to iterate over data structures other than objects or maps, you may consider using:

1. **Array methods**: `forEach()`, `for...of` with an array iterator.
2. **Set data structure**: Iterating directly over set elements using `for...of`.
3. **Legacy browser support**: Using older iteration methods like `for` loops, `document.getElementById().forEach()` (in some cases), or `Array.prototype.forEach.call()`.

Keep in mind that the choice of iteration method depends on the specific use case and required functionality.

Related benchmarks:

Obj vs map for in vs for of (version: 0)

testing map and object iteration, for in, for of

Comparing performance of: map for of vs obj for in vs map for of kyes

Created: 6 years ago by: Guest

Jump to the latest result

map for of

obj for in

map for of kyes

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

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