Benchmark: Lodash Deep Copy3

HTML Preparation code:

<!--your preparation HTML code goes here-->
<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js'></script>

Script Preparation code:

// Test data
var arr = new Array(1000).fill(null).map(() => ({
    id: Math.random(),
    event_id: `evt_${Math.random()}`,
    calendar_id: `cal_${Math.random()}`,
    event_json: {
        title: "Test Event",
        description: "Test Description",
        startDate: "2024-01-01",
        endDate: "2024-01-02",
        location: {
            address: "123 Test St",
            lat: 44.4582983,
            lng: -93.1616132
        },
        attendees: [
            { email: "test1@test.com", response: "accepted" },
            { email: "test2@test.com", response: "pending" }
        ]
    },
    is_latest: 1,
    start_date: "2024-01-01",
    end_date: "2024-01-02"
}));

Tests:

Lodash copydeep
myCopy = _.cloneDeep(arr);
Spread operator
myCopy = arr.map(item => ({ ...item, event_json: { ...item.event_json, location: { ...item.event_json.location }, attendees: item.event_json.attendees.map(attendee => ({ ...attendee })) } }));

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash copydeep
Spread operator

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:128.0) Gecko/20100101 Firefox/128.0

Browser/OS: Firefox 128 on Mac OS X 10.15

View result in a separate tab

Test name	Executions per second
Lodash copydeep	455.1 Ops/sec
Spread operator	4271.3 Ops/sec

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

LLMs can make mistakes. Check important info.

The benchmark defined in the provided JSON tests the performance of two different methods for deep copying an array of objects in JavaScript. The main focus is on comparing the performance of Lodash's `cloneDeep` method against a manual deep copy using the spread operator and the `map` function.

### Test Cases Explained

1. **Lodash Deep Copy (`_.cloneDeep`)**
   - **Benchmark Definition**: `myCopy = _.cloneDeep(arr);`
   - **Library Used**: Lodash
     - Lodash is a utility library that provides a variety of functions for common programming tasks in JavaScript. Its `cloneDeep` method is specifically designed to create a deep copy of an object or array, meaning it recursively copies all nested objects or arrays rather than just their references.
   - **Pros**:
     - Easy to use: Simply call `_.cloneDeep`, and it handles all the complexity.
     - Robust: Handles complex data structures well, including cyclic references.
   - **Cons**:
     - Performance: Generally slower than manual implementations for simpler data structures because of its comprehensive checks and recursive nature.
     - Dependency: Relies on an external library, which may not suit projects aiming for minimalism in file size.
  
2. **Spread Operator Deep Copy**
   - **Benchmark Definition**: 
     ```javascript
     myCopy = arr.map(item => ({
         ...item,
         event_json: {
             ...item.event_json,
             location: { ...item.event_json.location },
             attendees: item.event_json.attendees.map(attendee => ({ ...attendee }))
         }
     }));
     ```
   - **Approach**: This method uses the ECMAScript spread operator (`...`) to create a new shallow copy of the properties of an object or array. The `map` function is applied over the `arr` to return a new array with each item deeply copied.
   - **Pros**:
     - Performance: Generally faster than `_.cloneDeep` for structures with a known layout, as it avoids some overhead.
     - No dependencies: Relies purely on native JavaScript syntax, thus reducing bundle size.
   - **Cons**:
     - Complexity: Requires a deep understanding of the structure of the objects being copied, which can lead to errors if the structure changes.
     - Limitations: This method does not handle cyclic references and can fail when the copying structure is more complex than anticipated.

### Performance Results

The benchmark results indicate that the execution speed differs significantly between the two methods:

- **Spread Operator**: Achieved approximately **4271 executions per second**.
- **Lodash Copy Deep**: Achieved approximately **455 executions per second**.

This substantial difference suggests that for scenarios where performance is critical, particularly with known object structures, using the spread operator might be preferable.

### Other Considerations and Alternatives

- **Other Alternatives**:
   - **JSON Serialization**: Using `JSON.parse(JSON.stringify(obj))` for cloning offers a simple method for deep copying plain objects but fails with functions, undefined values, or circular references.
   - **Object.assign**: This method can create shallow copies, but it doesn't provide the same depth and may require additional layers if you want to deeply clone nested objects.
   - **Native `structuredClone`**: In environments that support it, `structuredClone` creates a deep clone of objects and can handle a variety of data types like Map, Set, and Date.

Ultimately, the choice of method depends on the specific requirements of the project, such as the complexity of the data structure being copied, performance needs, and whether it's acceptable to include external libraries in the codebase. For quick and simple applications with structured data, the spread operator offers an effective solution; for complex object structures and ensuring correctness, Lodash’s `cloneDeep` remains a robust option despite potential performance trade-offs.

Related benchmarks:

Lodash Deep Copy3 (version: 1)

Comparing performance of: Lodash copydeep vs Spread operator

Created: 7 days ago by: Guest

Jump to the latest result

Lodash copydeep

Spread operator

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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