Benchmark: js Map get VS Obj[key] w key=> val

HTML Preparation code:

<div id=''></div>

Script Preparation code:

var i = 0;
var count = 1000;
var map = new Map();
var obj = {};
for (i = 0; i < count; i++) {
    obj[i] = i * i;
    map.set(i, i * i);
}


console.log('map/obj:: ', {
    map199: map.get(199),
    obj199: obj[199],
});

Tests:

Map
for (i = 0; i < count; i++) { map.get(i); obj[i] }
Obj
for (i = 0; i < count; i++) { obj[i]; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Map
Obj

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 11 months ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/137.0.0.0 Safari/537.36

Browser/OS: Chrome 137 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Map	21185.7 Ops/sec
Obj	38308.8 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 11 months ago):

LLMs can make mistakes. Check important info.

The provided benchmark measures and compares the performance of two methods of accessing key-value pairs in JavaScript: using `Map` objects and plain JavaScript objects (`{}`), specifically focusing on their `get` operations. Here’s a detailed breakdown of the benchmark's components and implications:

### Options Compared

1. **Map.get(key)**: This method is part of the ES6 `Map` interface, which provides a way to store key-value pairs. It allows for key retrieval using the `.get()` method.
2. **Obj[key]**: This approach uses a plain JavaScript object to store key-value pairs and retrieves values by referencing the key directly within square brackets.

### Pros and Cons

#### Using `Map`:
- **Pros**:
  - Maintains the insertion order of keys, which can be beneficial in certain scenarios where order matters.
  - Can use any value as a key (including objects, functions, etc.), as opposed to objects which can only use strings or symbols as keys.
  - Offers better performance for frequent additions and deletions of key-value pairs.
  
- **Cons**:
  - Generally has a larger memory footprint than plain objects due to additional overhead required for maintaining key-value pairs.
  - Performance may be slower for simple key-value retrievals due to the overhead of method calls (like `map.get`).

#### Using Plain Objects:
- **Pros**:
  - Simpler syntax and generally faster for straightforward key retrieval when the keys are known to be strings or are numeric-like (implicitly converted to strings).
  - Consumes less memory than a `Map` for simple data structures, making it more efficient for quick lookups.
  - Supported in all JavaScript versions, making it more universally compatible.
  
- **Cons**:
  - May have performance issues with certain operations such as frequent additions and deletions.
  - Cannot store keys of non-string types, limiting flexibility in some use cases.
  - Does not guarantee key order prior to ES6, which may be critical in some applications.

### Other Considerations
- **Performance Context**: The benchmark data shows that accessing values from a plain object (`Obj`) had an execution rate of approximately 38,309 executions per second, while accessing values from a `Map` had about 21,186 executions per second, indicating that plain objects outperform `Map` in this specific test scenario.
- **Use Cases**: The choice between `Map` and objects often depends on the specific use case. If key ordering matters or if complex keys need to be used, `Map` is preferable. However, for simple lookups, a plain object is often faster and more memory-efficient.

### Alternatives
- **WeakMap**: Similar to `Map`, but with weak references to keys, preventing memory leaks when keys are no longer needed. This can be useful for storing metadata or private data without increasing the reference count.
- **Other Data Structures**: Depending on the requirements, other data structures such as `Set` for unique values or even custom implementations (like trees or tries for more complex data relationships) can be considered, although these come with additional complexity and varying performance characteristics.

This benchmark helps illustrate the relative performance trade-offs between two common approaches for key-value storage and retrieval in JavaScript, providing insights that can guide developers in making optimal design choices based on their application needs.

Related benchmarks:

js Map get VS Obj[key] w key=> val (version: 1)

js Map get VS Obj[key] w key=> val

Comparing performance of: Map vs Obj

Created: 11 months ago by: Guest

Jump to the latest result

Map

Obj

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 11 months ago):