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:

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

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
CHECK: Object
CHECK: Map

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 5 days ago)

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

Browser/OS: Firefox 151 on Windows

View result in a separate tab

Test name	Executions per second
CHECK: Object	105129.9 Ops/sec
CHECK: Map	10494.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: 2)

Comparing performance of: CHECK: Object vs CHECK: Map

Created: one year ago by: Registered User

Jump to the latest result

CHECK: Object

CHECK: Map

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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