Benchmark: shallow clone object vs map copy vs strucutredClone

Script Preparation code:

const entries = Array.from({
        length: 10_000
    }, (_, i) => i)
    .map(i => [
        `key${i}`,
        {
            a: Math.random() * 10000,
            b: Math.random().toString(36).slice(2)
        }
    ])


var obj = Object.fromEntries(entries);
var map = new Map(entries);

Tests:

Object shallow clone
const banana = {...obj}
Map shallow clone
const coconut = new Map(map)
Object structuredClone
const pineapple = structuredClone(obj)
Map structuredClone
const mango = structuredClone(map)
Object JSON.stringify copy
const papaya = JSON.parse(JSON.stringify(obj))

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Object shallow clone
Map shallow clone
Object structuredClone
Map structuredClone
Object JSON.stringify copy

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/135.0.0.0 Safari/537.36

Browser/OS: Chrome 135 on Windows

View result in a separate tab

Test name	Executions per second
Object shallow clone	283.4 Ops/sec
Map shallow clone	1131.1 Ops/sec
Object structuredClone	103.2 Ops/sec
Map structuredClone	133.5 Ops/sec
Object JSON.stringify copy	128.1 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 3 days ago):

LLMs can make mistakes. Check important info.

The benchmark you provided compares different methods of cloning data structures in JavaScript, specifically focusing on objects and the `Map` type. The four methods tested are:

1. **Object Shallow Clone (`{...obj}`)**
2. **Map Shallow Clone (`new Map(map)`)**
3. **Object Structured Clone (`structuredClone(obj)`)**
4. **Map Structured Clone (`structuredClone(map)`)**

### Purpose of Each Cloning Method

1. **Object Shallow Clone**
   - **Definition**: This method utilizes the spread operator `{...obj}` to create a shallow copy of the object.
   - **Pros**: 
     - Simple syntax and easy to read.
     - Works for plain objects.
   - **Cons**: 
     - It only creates a shallow copy; nested objects or arrays are copied by reference, not duplicated.
     - If the original object properties hold references to other objects, changes made to those nested objects will reflect in both the original and cloned objects.

2. **Map Shallow Clone**
   - **Definition**: This method utilizes the `new Map(map)` constructor to create a shallow copy of a `Map` object.
   - **Pros**: 
     - Simplifies copying of key-value pairs in Maps.
     - Retains order of entries.
   - **Cons**: 
     - Similar to the Object shallow clone, it’s a shallow copy, meaning nested objects are still referenced from the original `Map`.

3. **Object Structured Clone**
   - **Definition**: The `structuredClone` function creates a deep copy of an object, preserving nested structures and using a binary serialization method.
   - **Pros**: 
     - Creates a true deep copy, meaning that all nested objects and arrays are cloned as well.
     - Does not suffer from the same reference issues as shallow clones.
   - **Cons**: 
     - More performance-intensive than shallow clones due to the overhead of deep copying.
     - May not clone some special types (e.g., functions or symbolic properties).

4. **Map Structured Clone**
   - **Definition**: This uses `structuredClone(map)` to perform a deep copy on a `Map`.
   - **Pros**: 
     - Similarly ensures all nested structures are cloned.
     - Retains the order of entries and maintains the types specific to the Map.
   - **Cons**: 
     - Like the structured clone for objects, it is likely to have performance implications, though it is still more efficient than manually implementing deep copies.

### Performance Results

From the benchmark results, we observe execution speeds (executions per second) for each type of clone:

- **Map Shallow Clone**: 1078.98
- **Object Shallow Clone**: 293.19
- **Map Structured Clone**: 134.75
- **Object Structured Clone**: 106.08

### Observations
- The **Map Shallow Clone** clearly outperforms the Object shallow clone by a substantial margin, indicating that the map's implementation might be optimized for cloning.
- Both structured cloning methods (for `Map` and objects) are significantly slower than their shallow counterparts, reflecting their overhead in deep copying all nested structures.

### Alternatives

1. **JSON Method**: `const clone = JSON.parse(JSON.stringify(obj));`
   - **Pros**: Easy and familiar for simple objects. It creates a deep copy of serializable properties.
   - **Cons**: Cannot handle functions, `undefined`, and special object types (like `Map`, `Set`, etc.).

2. **Lodash's `cloneDeep()`**: `const clone = _.cloneDeep(obj);`
   - **Pros**: Handles a variety of types and more complex structures than the JSON method.
   - **Cons**: Adds additional dependency and can be performance-heavy for very large objects.

In summary, this benchmark evaluates both shallow and deep cloning techniques with a practical focus on performance, typical use cases, and their respective advantages and drawbacks. Software engineers should choose the appropriate cloning method based on the specific needs of their data structures and performance requirements.

Related benchmarks:

shallow clone object vs map copy vs strucutredClone (version: 2)

Comparing performance of: Object shallow clone vs Map shallow clone vs Object structuredClone vs Map structuredClone vs Object JSON.stringify copy

Created: 3 days ago by: Registered User

Jump to the latest result

Object shallow clone

Map shallow clone

Object structuredClone

Map structuredClone

Object JSON.stringify copy

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 3 days ago):