Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Lodash cloneDeep vs structuredClone vs JSON parse/stringify
(version: 0)
https://developer.mozilla.org/en-US/docs/Web/API/structuredClone
Comparing performance of:
Lodash cloneDeep vs Native structuredClone vs JSON parse/stringify
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:
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;
Tests:
Lodash cloneDeep
myCopy = _.cloneDeep(MyObject);
Native structuredClone
myCopy = structuredClone(MyObject);
JSON parse/stringify
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
Lodash cloneDeep
Native structuredClone
JSON parse/stringify
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
9 months ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/136.0.0.0 Safari/537.36
Browser/OS:
Chrome 136 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
Test name
Executions per second
Lodash cloneDeep
1615947.9 Ops/sec
Native structuredClone
726484.1 Ops/sec
JSON parse/stringify
1580178.5 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
**Overview of the Benchmark** The provided JSON represents a JavaScript microbenchmark that compares the performance of three different approaches: Lodash's `cloneDeep`, Mozilla's `structuredClone`, and `JSON.parse()`/`JSON.stringify()`. The benchmark is designed to test the creation of deep copies of an object, which can be useful in various scenarios, such as data serialization and deserialization. **Library Used** Lodash, a popular JavaScript utility library, provides the `cloneDeep` function. This function creates a deep copy of an object by recursively cloning its properties. Mozilla's `structuredClone` function is a more recent addition to the JavaScript language, introduced in ECMAScript 2020 (ES10). It provides a way to create a deep copy of an object without using JSON serialization and deserialization, making it more efficient than the traditional approach. **Special JS Features or Syntax** The benchmark uses the `structuredClone` function, which is a new feature in JavaScript. While not all browsers support this feature yet (as indicated by the Firefox Mobile 112 browser result), it's expected to become more widely supported in the future. **Options Compared** The benchmark compares three options: 1. **Lodash cloneDeep**: Creates a deep copy of an object using Lodash's `cloneDeep` function. 2. **Native structuredClone**: Creates a deep copy of an object using Mozilla's `structuredClone` function. 3. **JSON parse/stringify**: Creates a deep copy of an object by serializing it to a JSON string and then deserializing it back to an object. **Pros and Cons** Here are some pros and cons of each approach: 1. **Lodash cloneDeep**: * Pros: Widely supported, well-maintained library. * Cons: Adds external dependency (Lodash), may not be as efficient as native approaches. 2. **Native structuredClone**: * Pros: More efficient than traditional JSON serialization and deserialization, part of the JavaScript language standard. * Cons: Limited browser support, may require additional setup or polyfills. 3. **JSON parse/stringify**: * Pros: Widely supported, no external dependencies required. * Cons: May be less efficient than native approaches due to JSON serialization and deserialization overhead. **Other Considerations** When choosing between these approaches, consider the following factors: * Browser support: If you need to support older browsers or specific platforms, Lodash `cloneDeep` may be a safer choice. * Performance: If performance is critical, Native `structuredClone` might be the best option due to its native implementation and reduced overhead. * Maintainability: If you prefer to avoid external dependencies or complex setup, JSON parse/stringify might be a viable alternative. **Alternatives** If you don't have access to the `structuredClone` function or prefer not to use it, other alternatives for deep copying objects include: * Using `JSON.parse()` and `JSON.stringify()` with caution, as mentioned earlier. * Implementing a custom deep cloning function using recursion or iteration. * Utilizing libraries like Underscore.js (similar to Lodash) or other utility libraries that provide deep cloning functions.
Related benchmarks:
Lodash cloneDeep vs structuredClone vs JSON.stringify (small object)
Lodash (4.17.11) cloneDeep vs JSON Clone vs structuredClone
Lodash cloneDeep vs structuredClone vs Json.stringify
lodash clonedeep vs json.parse(stringify()) vs structuredClone
lodash cloneDeep vs. JSON.parse(JSON.stringify()) vs. structuredClone
Comments
Confirm delete:
Do you really want to delete benchmark?