<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>
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;
}
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;
myCopy = _.cloneDeep(MyObject);
myCopy = recursiveDeepCopy(MyObject);
myCopy = JSON.parse(JSON.stringify(MyObject));
myCopy = structuredClone(MyObject);
--enable-precise-memory-info
flag.
Test case name | Result |
---|---|
Lodash | |
Custom function | |
JSON.parse | |
structuredClone |
Test name | Executions per second |
---|---|
Lodash | 1285448.5 Ops/sec |
Custom function | 1590489.9 Ops/sec |
JSON.parse | 632891.8 Ops/sec |
structuredClone | 463829.2 Ops/sec |
Let's break down the benchmark and explain what's being tested.
Benchmark Description
The benchmark compares four different approaches to create a deep clone of an object: Lodash, Custom function (using a recursive deep copy approach), JSON.parse, and structuredClone.
What is tested?
The main goal of this benchmark is to determine which method provides the fastest execution time for creating a deep clone of an object. The object being cloned is called MyObject
, which has several properties, including nested objects and arrays.
Options compared
cloneDeep
function from Lodash, a popular JavaScript library.recursiveDeepCopy
that manually implements the deep cloning process.JSON.stringify
method to convert the original object into a JSON string and then parses it back into an object using JSON.parse
.structuredClone
method, a newer API introduced in JavaScript, which creates a deep clone of an object.Pros and cons
Special JS feature/syntax
None mentioned explicitly. However, it's worth noting that JSON.parse
and structuredClone
rely on ECMAScript 2022 features (JSON.stringify
and structuredClone
, respectively), which might not be supported by all browsers or versions of Node.js.
Other alternatives
If you need a deep clone but want to avoid using Lodash, you could consider implementing your own recursive function similar to the custom function provided in the benchmark. Alternatively, if you're working with older browsers that don't support structuredClone
, you might need to stick with one of the other approaches.
In summary, this benchmark compares four different methods for creating a deep clone of an object: Lodash, Custom function, JSON.parse, and structuredClone. The choice of method depends on factors like performance requirements, memory constraints, and personal preference regarding fine-grained control or convenience.