Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
test clonedeep
(version: 0)
Comparing performance of:
clonedeep vs structuredClone vs json parsing
Created:
3 years ago
by:
Guest
Jump to the latest result
HTML Preparation code:
<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>
Script Preparation code:
let bigArray = []; for (i = 0; i < 10000; i++) { bigArray.push([{ first: i, second: `${i} som en sträng`, third: i * 3.14, }]); } 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...' }, bigobjectArray: bigArray, }; var myCopy = null;
Tests:
clonedeep
myCopy = _.cloneDeep(MyObject);
structuredClone
myCopy = structuredClone(MyObject);
json parsing
myCopy = JSON.parse(JSON.stringify(MyObject));
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
clonedeep
structuredClone
json parsing
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
8 months ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/137.0.0.0 Safari/537.36
Browser/OS:
Chrome 137 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
Test name
Executions per second
clonedeep
215.1 Ops/sec
structuredClone
269.4 Ops/sec
json parsing
367.3 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the provided benchmark and explain what is being tested. **Benchmark Definition** The benchmark definition provides two scripts: `Script Preparation Code` and `Html Preparation Code`. The `Script Preparation Code` defines an object `MyObject` with various properties, including a nested array `bigArray`, which contains objects with different data types (number, string, and boolean). The `Html Preparation Code` includes a script tag that loads the Lodash library. **Individual Test Cases** There are three individual test cases: 1. **clonedeep**: This test case uses the `_.cloneDeep()` function from Lodash to create a deep copy of `MyObject`. 2. **structuredClone**: This test case uses the `structuredClone()` function (new in JavaScript) to create a deep clone of `MyObject`. 3. **json parsing**: This test case uses the `JSON.parse(JSON.stringify(MyObject))` syntax to parse and recreate `MyObject`. **What is being tested?** These three test cases are designed to compare the performance of different methods for creating a deep copy of an object with nested arrays. **Options compared:** * **_.cloneDeep()**: A function from Lodash that creates a deep clone of an object. * **structuredClone()**: A new JavaScript function (introduced in ECMAScript 2020) that creates a deep clone of an object, preserving all its properties and their values. * **JSON.parse(JSON.stringify(MyObject))**: A syntax that parses and recreates `MyObject` using the JSON stringification method. **Pros and Cons:** * **_.cloneDeep()**: + Pros: Easy to use, efficient, and widely supported by libraries like Lodash. + Cons: May not work as expected with certain data types or nested structures. * **structuredClone()**: + Pros: New in JavaScript, designed for deep cloning, and preserves all properties and their values. + Cons: Only available in modern browsers and may require additional setup for older environments. * **JSON.parse(JSON.stringify(MyObject))**: + Pros: Simple syntax, widely supported by most browsers and Node.js versions. + Cons: May not work correctly with certain data types (e.g., functions, undefined) or nested structures. **Other considerations:** * The `structuredClone()` function is designed to be more efficient than the other two options, as it uses a binary format to serialize the object's properties and their values. However, its availability is limited to modern browsers. * The `_.cloneDeep()` function is widely supported by libraries like Lodash, making it a popular choice for deep cloning. However, its performance may vary depending on the specific use case. **Alternatives:** * For creating a deep clone of an object with nested arrays, you can also consider using other libraries or frameworks that provide similar functionality, such as `lodash` (alternative to `_.cloneDeep()`), `immer`, or `deepClone`. * If performance is critical and modern browsers are not supported, you may need to implement your own custom cloning algorithm or use a different approach, such as serializing the object's properties and values using JSON.stringify(). I hope this explanation helps software engineers understand what is being tested in the provided benchmark!
Related benchmarks:
Lodash cloneDeep vs JSON Clone with huge object
Lodash cloneDeep vs JSON Clone (very big object)
Lodash cloneDeep vs JSON Clone vs Object Spread
Lodash cloneDeep vs JSON parse
Comments
Confirm delete:
Do you really want to delete benchmark?