Benchmark: test clonedeep against other things

HTML Preparation code:

<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>

Script Preparation code:

let bigArray = [];
for (i = 0; i < 10000; i++) {
    bigArray.push([{
      first: i,
      second: `${i} som en sträng`,
      third: i * 3.14,
    }]);
}
var MyObject = {
    description: 'Creates a deep copy of source, which should be an object or an array.',
    myNumber: 123456789,
    myBoolean: true,
    jayson: {
        stringify: 'JSON.stringify() method converts a JavaScript value to a JSON string....',
        parse: 'JSON.parse() method parses a JSON string...'
    },
    bigobjectArray: bigArray,
};

var myCopy = null;

Tests:

clonedeep
myCopy = _.cloneDeep(MyObject);
structuredClone
myCopy = structuredClone(MyObject);
json parsing
myCopy = JSON.parse(JSON.stringify(MyObject));
Object Assign
myCopy = Object.assign({}, MyObject);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
clonedeep
structuredClone
json parsing
Object Assign

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 141 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
clonedeep	259.7 Ops/sec
structuredClone	344.9 Ops/sec
json parsing	469.5 Ops/sec
Object Assign	10835333.0 Ops/sec

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

LLMs can make mistakes. Check important info.

The provided JSON represents a benchmark that tests different methods for creating a deep copy of an object in JavaScript. Here's an explanation of each approach compared in the benchmark as well as their pros and cons:

### Approaches Compared:

1. **Lodash's `cloneDeep` Method**:
   - **Benchmark Definition**: `myCopy = _.cloneDeep(MyObject);`
   - **Pros**: 
     - It can handle complex objects, including arrays, nested objects, and various types of properties (e.g., Date objects, Set, Map).
     - It’s well-tested and widely used in various projects.
   - **Cons**:
     - It brings in the overhead of loading the entire Lodash library (even if just for one function).
     - Performance might not be optimal for simple objects or for large datasets when compared to native options.

2. **Native `structuredClone`**:
   - **Benchmark Definition**: `myCopy = structuredClone(MyObject);`
   - **Pros**: 
     - It is a built-in function (introduced in recent versions) designed to clone complex types, including handling objects, arrays, Date objects, and more directly.
     - No need for external libraries, which keeps applications lightweight and can enhance performance.
   - **Cons**:
     - Browser compatibility may be a concern for older browsers since `structuredClone` is supported in more recent versions.

3. **JSON Parsing (Stringify and Parse)**:
   - **Benchmark Definition**: `myCopy = JSON.parse(JSON.stringify(MyObject));`
   - **Pros**: 
     - Simple and straightforward to use.
     - No dependencies on external libraries, which is attractive for smaller projects.
   - **Cons**:
     - It only works if the object is JSON-serializable (no functions, undefined, or circular references).
     - It can lead to data loss (e.g., Date types become strings).

4. **Object Assign**:
   - **Benchmark Definition**: `myCopy = Object.assign({}, MyObject);`
   - **Pros**: 
     - Good for shallow copying of properties, simple syntax, and built into the language.
     - No dependencies on additional libraries.
   - **Cons**:
     - It only creates a shallow copy, meaning nested objects are not cloned; instead, references to them are copied.
     - This method is inadequate for cases where a full clone of deep structures is needed.

### Benchmark Results:

The benchmark tests were executed under a specific environment (Chrome 141 on Mac OS X 10.15.7), yielding the following performance metrics in terms of executions per second:

- **Object Assign**: 9,550,187 executions/sec (fastest)
- **JSON Parsing**: 424.94 executions/sec 
- **Structured Clone**: 327.79 executions/sec
- **CloneDeep**: 220.77 executions/sec (slowest)

### Conclusion:

In conclusion, the selected method for creating deep copies in JavaScript should be driven by use case requirements. For complex objects, `cloneDeep` or `structuredClone` are advisable despite the difference in performance. For simpler objects or scenarios where data loss is acceptable, `JSON.parse(JSON.stringify())` can be useful, while `Object.assign` works best for shallow copies. Each method presents its benefits and drawbacks, making selection essential based on object complexity and performance needs.

Related benchmarks:

test clonedeep against other things (version: 1)

Comparing performance of: clonedeep vs structuredClone vs json parsing vs Object Assign

Created: 6 months ago by: Guest

Jump to the latest result

clonedeep

structuredClone

json parsing

Object Assign

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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