Benchmark: Map vs Object - Insertion, Lookup & Update

Script Preparation code:

const map = new Map();
const obj = {};

const baseKey = '00000000000000000000';

const getKey = (index) => {
  let key = baseKey;

  const chars = [...index.toString()];
  for (let i = 0; i < chars.length; i++) {
    key[i] = chars[i];
  }

  return key;
};

Tests:

Map
for (let i = 0; i < 100000; i++) { const key = getKey(i); map.set(key, 'value'); const _ = map.get(key); map.set(key, 'newValue'); }
Object
for (let i = 0; i < 100000; i++) { const key = getKey(i); obj[key] = 'value'; const _ = obj[key]; obj[key] = 'newValue'; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Map
Object

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 140 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Map	12.9 Ops/sec
Object	13.8 Ops/sec

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

LLMs can make mistakes. Check important info.

This benchmark compares the performance of two data structures in JavaScript: `Map` and `Object`. Specifically, it measures the time it takes to insert, lookup, and update values using both data structures under defined conditions.

### Overview of Tested Options

1. **Map**
   - A `Map` is a built-in object in JavaScript that holds key-value pairs. It allows keys of any type (including objects) and maintains the insertion order. In this benchmark, the keys for the `Map` are generated using the `getKey` function that transforms an index into a string of a fixed length.

2. **Object**
   - An `Object` is a core construct in JavaScript, serving as a basic hash table where keys are strings or symbols. Here, the benchmark uses string keys generated similarly through the `getKey` function.

### Benchmark Breakdown

- **Insertion**: Both structures are tested by setting a value for a key.
- **Lookup**: Both structures retrieve the value associated with that key.
- **Update**: Both structures update that key with a new value.

### Pros and Cons

#### Pros of Map
- **Key Flexibility**: Maps can use any value (including functions, objects, etc.) as keys, which is a major use case advantage over objects.
- **Order Preservation**: Maps maintain the order of elements as they were inserted.
- **Performance**: Generally, maps have better performance for frequent additions and removals due to their underlying implementation.

#### Cons of Map
- **Memory Overhead**: Maps can consume more memory than objects due to their internal structure.
- **Simplicity**: For simple key-value storage when keys are strings, objects are often more straightforward.

#### Pros of Object
- **Simplicity**: For basic key-value pair needs, especially with string keys, objects are easier to use and understand.
- **Native Syntax**: The syntax for creating and accessing objects is often more concise.

#### Cons of Object
- **Key Limitations**: Objects can only use strings or symbols as keys, which can be limiting.
- **Potential Performance Hit**: Performance can degrade with frequent changes due to the complicated prototype chain and interference with properties.

### Alternative Considerations

- **WeakMap**: If the need arises for garbage collection of keys, a `WeakMap` allows objects to be garbage-collected when there are no other references. It doesn’t prevent memory leaks when used for keys.
- **Arrays or Sets**: Depending on the operations needed, for indexed access or uniqueness respectively, arrays or Sets may be better alternatives in specific use cases.

### Special JavaScript Features or Syntax

The benchmark does not employ any specialized or advanced JavaScript features or syntax but relies on traditional constructs. However, some key JavaScript characteristics worth noting include:

- **Block Scope with `let`**: The `let` keyword is used in the loops, ensuring that variables are scoped to the block.
- **Arrow Functions**: While not directly used in this benchmark, they are commonly employed for concise function expressions, particularly useful in mapping or reducing operations.

Overall, the choice between `Map` and `Object` in JavaScript should depend on specific use cases. For scenarios requiring ordered collections or diverse key types, `Map` is typically preferable. For simpler, string-keyed implementations, `Object` may suffice. The benchmark serves as a concrete analysis to inform decision-making regarding data structure selection based on performance.

Related benchmarks:

Map vs Object - Insertion, Lookup & Update (version: 1)

Insertion, Lookup & Update of Map vs Object. Keys length: 20. Loop length: 100000.

Comparing performance of: Map vs Object

Created: 11 months ago by: Guest

Jump to the latest result

Map

Object

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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