<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js'></script>
<script src='https://cdn.jsdelivr.net/npm/jsondiffpatch@0.4.1/dist/jsondiffpatch.umd.min.js'></script>
<script src='https://cdn.jsdelivr.net/npm/rfdc@1.3.0'></script>
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...'
}
};
var myCopy = null;
var rfdcClone = rfdc();
///////////////////////////////////////////////////////////////////
function recursiveDeepCopy(o) {
var newO,
i;
if (typeof o !== 'object') {
return o;
}
if (!o) {
return o;
}
if ('[object Array]' === Object.prototype.toString.apply(o)) {
newO = [];
for (i = 0; i < o.length; i += 1) {
newO[i] = recursiveDeepCopy(o[i]);
}
return newO;
}
newO = {};
for (i in o) {
if (o.hasOwnProperty(i)) {
newO[i] = recursiveDeepCopy(o[i]);
}
}
return newO;
}
myCopy = _.cloneDeep(MyObject);
myCopy = JSON.parse(JSON.stringify(MyObject));
myCopy = recursiveDeepCopy(MyObject);
myCopy = structuredClone(MyObject);
myCopy = rfdcClone(MyObject);
--enable-precise-memory-info
flag.
Test case name | Result |
---|---|
lodash cloneDeep | |
JSON.parse(JSON.stringify()) | |
recursiveDeepCopy | |
structuredClone | |
rfdc |
Test name | Executions per second |
---|---|
lodash cloneDeep | 1818083.4 Ops/sec |
JSON.parse(JSON.stringify()) | 1608523.5 Ops/sec |
recursiveDeepCopy | 5922363.5 Ops/sec |
structuredClone | 745693.6 Ops/sec |
rfdc | 6479690.0 Ops/sec |
This benchmark compares five different methods for creating deep copies of an object in JavaScript. The primary goal is to evaluate their performance in terms of how many copies can be created per second, which is quantified as "Executions Per Second." The methods being tested include:
Lodash's cloneDeep
:
myCopy = _.cloneDeep(MyObject);
cloneDeep
handles a wide variety of edge cases, including circular references and complex objects, making it a robust but potentially slower option.JSON parse
and stringify
:
myCopy = JSON.parse(JSON.stringify(MyObject));
undefined
, and special object types (like Dates, Maps, Sets), and can fail on circular references.Custom recursive deep copy function:
myCopy = recursiveDeepCopy(MyObject);
Structured Clone:
myCopy = structuredClone(MyObject);
structuredClone
function is a built-in JavaScript function that creates a deep copy of a given value, coping well with complex data types.Rfdc:
myCopy = rfdcClone(MyObject);
In the benchmark results:
cloneDeep
and JSON parse/stringify
performed significantly slower, and structuredClone had the lowest performance.When choosing a deep copying method, developers should consider:
There are other libraries and methods for deep cloning in JavaScript, such as:
In conclusion, the choice of method depends largely on the specific needs of the application and its expected use cases. Performance, ease of use, edge case handling, and compatibility with different data types are often at the forefront of decision-making in this area.