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...'
}
};
var myCopy = null;
JSON.parse(JSON.stringify(obj));
structuredClone(obj);
const fast_deep_clone = (obj) => {
function cloneArray(a, fn) {
var keys = Object.keys(a);
var a2 = new Array(keys.length)
for (const key of keys) {
var k = keys[key];
var cur = a[k];
if (typeof cur !== 'object' || cur === null) {
a2[k] = cur;
} else {
a2[k] = fn(cur);
}
}
return a2;
}
if (typeof obj !== 'object' || obj === null) return obj;
if (obj instanceof Date) return new Date(obj);
if (Array.isArray(obj)) return cloneArray(obj, fast_deep_clone);
if (obj.toString() !== '[object Object]') {
return obj.toString();
}
let value, key;
const keys = Object.keys(obj);
const outObject = {};
for (key of keys) {
if (key) {
value = obj[key];
outObject[key] = fast_deep_clone(value);
}
}
return outObject;
};
fast_deep_clone(obj);
--enable-precise-memory-info
flag.
Test case name | Result |
---|---|
JSON.parse(JSON.stringify()) | |
structuredClone() | |
fast_deep_clone() |
Test name | Executions per second |
---|---|
JSON.parse(JSON.stringify()) | 719232.6 Ops/sec |
structuredClone() | 614901.4 Ops/sec |
fast_deep_clone() | 1704037.6 Ops/sec |
Let's dive into the explanation of the benchmark.
Benchmark Overview
The benchmark measures the performance of three different methods to create deep copies of objects: JSON.parse(JSON.stringify(obj))
, structuredClone(obj)
, and a custom implementation called fast_deep_clone()
. The benchmark tests how many executions per second each method can handle on a desktop machine running Chrome 112.
Method Comparison
JSON.parse(JSON.stringify(obj))
: This method uses the Stringify()
and Parse()
methods to convert an object to a JSON string and then parse it back into an object, respectively. While this method is simple, it's not designed for deep copying and can lead to issues with cyclic references (i.e., objects that reference themselves).structuredClone(obj)
: This method is a newer API introduced in ECMAScript 2020, which provides a more efficient and safe way to create deep copies of objects. It's designed to handle cyclic references and other edge cases.JSON.parse(JSON.stringify(obj))
.fast_deep_clone()
: This is a custom implementation that recursively clones an object's properties, handling various data types (including arrays, objects, and dates). It's designed to be efficient and handle complex objects.structuredClone()
.Library/Feature Explanation
The benchmark uses the following libraries or features:
structuredClone()
: A newer ECMAScript API introduced in 2020, which provides a safe and efficient way to create deep copies of objects.fast_deep_clone()
implementation is custom code).Special JS Features/Syntax
There are no specific JavaScript features or syntax used in this benchmark that would require special explanation.
Other Alternatives
If you're looking for alternative methods to create deep copies of objects, you could consider:
JSON.stringify(obj)
and eval(JSON.stringify(obj))
: Similar to the first method, but with the added complexity of parsing a JSON string back into an object using eval()
.Lodash Deep Clone()
: A popular library that provides a simple and efficient way to create deep copies of objects.immer()
: Another library that offers a more functional programming approach to creating immutable copies of objects.Keep in mind that each method has its trade-offs, and the choice ultimately depends on your specific use case and requirements.