Benchmark: JSON.stringify + JSON.parse vs structuredClone

Script Preparation code:

var obj = {
  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...'
  }
};

Tests:

JSON.stringify + JSON.parse
JSON.parse(JSON.stringify(obj));
structuredClone
structuredClone(obj);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
JSON.stringify + JSON.parse
structuredClone

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/26.4 Safari/605.1.15

Browser/OS: Safari 26 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
JSON.stringify + JSON.parse	4134432.8 Ops/sec
structuredClone	1372881.5 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 benchmark and explain what is being tested, compared, and their pros and cons.

**Benchmark Definition**

The benchmark is defined as a comparison between two methods for creating a deep copy of an object in JavaScript:

1. `JSON.stringify()` method
2. `structuredClone()`

The benchmark is designed to measure the performance difference between these two approaches on the same input data.

**Script Preparation Code**

The script preparation code defines an object `obj` with various properties, including:

* `description`: a string describing the benchmark
* `myNumber`: a number (123456789)
* `myBoolean`: a boolean (true)
* `jayson`: an object with two properties:
	+ `stringify`: a string explaining the purpose of the `JSON.stringify()` method
	+ `parse`: a string explaining the purpose of the `JSON.parse()` method

This script is used to create the input data for the benchmark.

**Html Preparation Code**

The html preparation code is empty, indicating that no HTML is needed for this benchmark.

**Individual Test Cases**

There are two test cases:

1. **`JSON.stringify + JSON.parse`**: This test case measures the performance of using `JSON.stringify()` to create a deep copy of the input object and then parsing it back to a JavaScript object.
2. **`structuredClone()`**: This test case measures the performance of using the `structuredClone()` method (introduced in ECMAScript 2020) to create a deep copy of the input object.

**Pros and Cons**

1. **`JSON.stringify + JSON.parse`**:
	* Pros:
		+ Widely supported by most browsers
		+ Easy to implement
	* Cons:
		+ Can lead to loss of type information (e.g., numbers become strings)
		+ Can be slower due to the parsing step
2. **`structuredClone()`**:
	* Pros:
		+ Preserves type information and structure
		+ Can be faster since it avoids the parsing step
	* Cons:
		+ Less widely supported (only in ECMAScript 2020 compliant browsers)
		+ Requires a recent browser version to work

**Library/External Functionality**

There is no external library used in this benchmark. However, `structuredClone()` is a built-in function introduced in ECMAScript 2020.

**Special JS Feature/Syntax**

The only special feature/syntax mentioned in the benchmark is the use of `structuredClone()`, which is a relatively new function introduced in ECMAScript 2020. This allows for more efficient and accurate creation of deep copies, especially when dealing with complex data structures.

**Other Alternatives**

Alternative methods for creating deep copies of objects in JavaScript include:

* Using libraries like Lodash or JSON5
* Implementing custom cloning functions using recursion or iteration
* Using the `Array.prototype.slice()` method to create a shallow copy and then manually handling object references

However, these alternatives may not be as efficient or accurate as `structuredClone()`, especially for complex data structures.

Related benchmarks:

JSON.stringify + JSON.parse vs structuredClone (version: 0)

Comparing performance of: JSON.stringify + JSON.parse vs structuredClone

Created: 4 years ago by: Guest

Jump to the latest result

JSON.stringify + JSON.parse

structuredClone

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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