Benchmark: {} vs Map with set and CHECK value exists

HTML Preparation code:

<!--your preparation HTML code goes here-->

Script Preparation code:

const d1 = {};

for (let i = 0; i < 10000; i++) {
  	d1[i] = i;
}

const d2 = new Map();

for (let i = 0; i < 10000; i++) {
  	d2.set(i, i);
}

Tests:

Creation: Object
let v = 0; for (let i1 = 0; i1 < 10000; i1++) { if (d1[i1] !== undefined) { v++; } }
Creation: Map
let v = 0; for (let i2 = 0; i2 < 10000; i2++) { if (d2.has(i2)) { v++; } }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Creation: Object
Creation: Map

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:136.0) Gecko/20100101 Firefox/136.0

Browser/OS: Firefox 136 on Windows

View result in a separate tab

Test name	Executions per second
Creation: Object	91975.4 Ops/sec
Creation: Map	10409.6 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated one year ago):

LLMs can make mistakes. Check important info.

In this benchmark, two data structure approaches in JavaScript are compared: using a plain object (`{}`) and a `Map` for storing key-value pairs. The benchmark measures the performance of checking for the existence of keys in both structures.

### Approaches Compared

1. **Plain Object (`{}`)**
   - **Test Case**: 
     ```javascript
     let v = 0;

for (let i1 = 0; i1 < 10000; i1++) {
       if (d1[i1] !== undefined) {
           v++;
       }
     }
     ```
   - **Description**: This test iterates through integers 0 to 9999 and checks if the corresponding property exists in the plain object `d1`. The existence of a property is determined using `d1[i1] !== undefined`.

2. **Map**
   - **Test Case**:
     ```javascript
     let v = 0;

for (let i2 = 0; i2 < 10000; i2++) {
       if (d2.has(i2)) {
           v++;
       }
     }
     ```
   - **Description**: This test similarly checks for the presence of the keys in the `Map` `d2` using the `has` method, which checks if a key exists in the map without attempting to access its value.

### Performance Metrics

From the benchmark results:
- **Object**: 91,975.35 executions per second
- **Map**: 10,409.64 executions per second

### Pros and Cons of Each Approach

#### Plain Object (`{}`)
**Pros**:
- Fast for simple key-value pair lookups when the keys are strings or can be coerced to strings. 
- Lightweight, as plain objects are a fundamental part of JavaScript and have no additional overhead of a library.
  
**Cons**:
- The `undefined` check can lead to potential pitfalls if a property is set to `undefined` (it may falsely indicate absence).
- Objects can inherit properties from their prototype, which may lead to unexpected behavior unless careful use of `hasOwnProperty` is adopted for checks.
- Limited to string keys—only strings (or symbols) can be used as keys.

#### Map
**Pros**:
- Built-in method `has` is cleaner and explicitly checks for key existence without the risk of confusing `undefined` values.
- More versatile—`Map` can accept keys of any data type (including objects).
- The iteration order of `Map` is guaranteed based on the order of insertion.

**Cons**:
- Slower for simple numeric key checks as observed in this benchmark.
- More memory overhead compared to plain objects because it is a specialized data structure.

### Other Considerations

1. **Use Cases**: 
    - Choose a plain object when you need a simple dictionary-like structure and performance on basic string keys is critical.
    - Use `Map` when needing to handle various key types or when you want predictable iteration.
  
2. **Alternatives**: 
    - For larger datasets or more advanced key management, one might also consider using other data structures like Sets (if unique keys are required), or third-party libraries like Immutable.js for immutable data structures that can lead to more predictable state management in applications.

3. **Performance Variability**: 
    - Performance can vary significantly across different JavaScript engines (like V8 in Chrome vs. SpiderMonkey in Firefox), and so results should be interpreted in that context if considering code portability.

In conclusion, the choice between using a plain object or a `Map` can significantly affect both performance and functionality based on the specific use case, and this benchmark provides insight into those trade-offs.

Related benchmarks:

{} vs Map with set and CHECK value exists (version: 1)

Comparing performance of: Creation: Object vs Creation: Map

Created: one year ago by: Registered User

Jump to the latest result

Creation: Object

Creation: Map

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated one year ago):