Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Lodash cloneDeep vs structuredClone vs JSONNNSssnNNa
(version: 0)
https://developer.mozilla.org/en-US/docs/Web/API/structuredClone
Comparing performance of:
Lodash cloneDeep vs Native structuredClone vs JSON
Created:
2 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
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
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
2 years ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36
Browser/OS:
Chrome 120 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
Test name
Executions per second
Lodash cloneDeep
1594184.0 Ops/sec
Native structuredClone
615238.4 Ops/sec
JSON
1109191.4 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
**Overview** The provided JSON represents a JavaScript microbenchmark on MeasureThat.net, which compares the performance of three different methods for creating deep copies of objects: Lodash's `cloneDeep`, Native Web API's `structuredClone`, and JSON string manipulation using `JSON.parse(JSON.stringify())`. **Methods Compared** 1. **Lodash cloneDeep**: This method uses a library (Lodash) to create a deep copy of an object. 2. **Native structuredClone**: This is a native Web API (Chrome 120) that creates a deep copy of an object, introduced in Chrome 80 as part of the Web Assembly and Worker APIs. 3. **JSON**: This method uses JSON string manipulation using `JSON.parse(JSON.stringify())` to create a deep copy of an object. **Pros and Cons** 1. **Lodash cloneDeep**: * Pros: Easy to use, widely supported by other libraries, and can handle complex data structures. * Cons: Requires including Lodash in the project's dependencies, which may increase bundle size. 2. **Native structuredClone**: * Pros: Native implementation, likely to be optimized for performance, and doesn't require additional library dependencies. * Cons: Currently only supported by Chrome 80+, other browsers may not support it yet or at all. 3. **JSON**: * Pros: Lightweight, widely supported by most JavaScript implementations, and easy to implement manually. * Cons: Can be fragile if the object's structure changes (e.g., cycles, arrays with nested objects), and can lead to performance issues for large data sets. **Library and Its Purpose** 1. **Lodash**: Lodash is a popular utility library that provides various functions for working with JavaScript data structures, including deep copy operations. **Special JS Feature or Syntax** None mentioned in the provided benchmark. **Other Considerations** When choosing between these methods, consider the specific requirements of your project: * If you need to support older browsers or require a lightweight solution, JSON might be a good choice. * If you're targeting modern browsers and prioritize performance, Native structuredClone is worth considering. * If ease of use and wide compatibility are more important than performance optimizations, Lodash cloneDeep remains a reliable option. **Alternatives** Other deep copy methods in JavaScript include: 1. **Array.prototype.slice()**: Creates a shallow copy of an array. 2. **Object.assign()**: Creates a new object with the properties of another object. 3. **For...of loops and Array.prototype.map()**: Can be used to create copies of arrays or objects using more functional programming approaches. These alternatives might offer better performance, memory efficiency, or other advantages for specific use cases, but may require additional setup or understanding of JavaScript fundamentals.
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-Clone
Lodash cloneDeep vs structuredClone vs JSON-JSON
Lodash cloneDeep vs structuredClone vs Json.stringify
Comments
Confirm delete:
Do you really want to delete benchmark?