Benchmark: structuredClone vs spread vs Object.assign() vs JSON.parse

Script Preparation code:

var oldObj = {
    "single": false,
    "applyOverTaxes": false,
    "discountType": "1",
    "value": 100,
    "minimumAmount": 0,
    "quantity": 1,
    "suffixLength": 8,
    "code": "IF5R0AFX",
    "vertical": true,
    "allowedPaymentMethods": null,
    "allowedBanks": null,
    "types": undefined,
    "partners": "Many",
    "startDate": "2020-10-21T00:00:00.000Z",
    "endDate": "2020-10-21T00:00:00.000Z",
    "applyed": false
}

Tests:

structuredClone()
const newObj = structuredClone(oldObj)
spread syntax
const newObj = {...oldObj}
Object.assign()
const newObj = Object.assign({}, oldObj)
JSON.parse(JSON.stringify())
const newObj = JSON.parse(JSON.stringify(oldObj))

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
structuredClone()
spread syntax
Object.assign()
JSON.parse(JSON.stringify())

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/134.0.0.0 Safari/537.36 Edg/134.0.0.0

Browser/OS: Chrome 134 on Linux

View result in a separate tab

spread syntax

29.7M/s

Object.assign()

3.6M/s

JSON.parse(JSON.stringify())

486K/s

structuredClone()

241K/s

View exact numbers

Test name	Executions per second
✓ spread syntax	29,666,498 Ops/sec
Object.assign()	3,646,825 Ops/sec
JSON.parse(JSON.stringify())	486,296 Ops/sec
structuredClone()	240,585 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

Let's break down the provided JSON and explain what's being tested.

**Benchmark Overview**

The benchmark is comparing four different methods to create a deep copy of an object: `structuredClone()`, spread syntax (`{...oldObj}`), `Object.assign()` with an empty object as the second argument, and `JSON.parse(JSON.stringify(oldObj))`.

**Method Descriptions and Trade-Offs**

1. **structuredClone()**: This method is introduced in ECMAScript 2020 as a way to create a deep copy of an object without mutating the original. It's designed to be efficient and safe. Pros: efficient, safe, and easy to use. Cons: not widely supported yet, and some browsers may have performance issues.
2. **Spread syntax (`{...oldObj}`)**: This method uses the spread operator to create a new object with the same properties as `oldObj`. While it's concise and readable, it can lead to unexpected behavior if not used carefully (e.g., when dealing with functions or objects that have prototype chains). Pros: easy to read and write, but requires caution. Cons: may not work as expected in all cases.
3. **Object.assign() with an empty object**: This method uses `Object.assign()` to create a new object with the same properties as `oldObj`. By passing an empty object as the second argument, it avoids mutating the original object. Pros: widely supported and efficient. Cons: may not work if `oldObj` is null or undefined.
4. **JSON.parse(JSON.stringify(oldObj))**: This method uses JSON serialization to create a deep copy of `oldObj`. While it's simple to understand, it can lead to issues with circular references and other complex data structures. Pros: simple to use, but may not work correctly in all cases. Cons: brittle and prone to errors.

**Library and Syntax Explanation**

The test case uses the `structuredClone()` method introduced in ECMAScript 2020.

**Other Considerations**

When dealing with deep copies of objects, it's essential to consider issues like:

* Circular references: When an object references itself, creating a deep copy can lead to infinite loops.
* Prototype chains: When objects inherit properties from prototypes, creating a deep copy may not work as expected.
* Functions and methods: When functions or methods are copied, they may lose their context or reference.

**Alternatives**

If you're looking for alternatives to the above methods, consider:

* Using libraries like Lodash's `cloneDeep()` or Underscore.js's `clone()`
* Implementing custom deep copy logic using recursion or iteration
* Using JSON serialization with a library like JSON5 or json-stringify-safe

In summary, the benchmark provides an opportunity to compare the performance and behavior of different methods for creating deep copies of objects. By understanding the trade-offs and potential pitfalls of each method, you can choose the most suitable approach for your specific use case.

structuredClone vs spread vs Object.assign() vs JSON.parse (version: 0)

Comparing performance of: `structuredClone() vs spread syntax vs Object.assign() vs JSON.parse(JSON.stringify())`

Created: one year ago by: Guest

Go to the latest result

structuredClone()

spread syntax

Object.assign()

JSON.parse(JSON.stringify())

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

structuredClone vs spread vs Object.assign() vs JSON.parse (version: 0)

Comparing performance of: structuredClone() vs spread syntax vs Object.assign() vs JSON.parse(JSON.stringify())

Created: one year ago by: Guest

Go to the latest result

structuredClone()

spread syntax

Object.assign()

JSON.parse(JSON.stringify())

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

Related benchmarks

Comparing performance of: `structuredClone() vs spread syntax vs Object.assign() vs JSON.parse(JSON.stringify())`