Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
lodash merge vs object.assign vs spread (v3)
(version: 0)
Comparing performance of:
lodash merge vs object.assign vs spread vs json deep clone
Created:
4 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>
Tests:
lodash merge
var defaultOptions = { headers: { 'content-type': 'application/json', 'user-agent': 'super-app', } }; var options = { headers: {'content-type': 'application/xml' }, data: { 'key': 'value' } }; var result = _.merge(defaultOptions, options);
object.assign
var defaultOptions = { headers: { 'content-type': 'application/json', 'user-agent': 'super-app', } }; var options = { headers: { 'content-type': 'application/xml' }, data: { 'key': 'value' } }; var result = Object.assign(defaultOptions, options);
spread
var defaultOptions = { headers: { 'content-type': 'application/json', 'user-agent': 'super-app', } }; var options = { headers: { 'content-type': 'application/xml' }, data: { 'key': 'value' } }; var result = { ...defaultOptions, ...options };
json deep clone
var defaultOptions = { headers: { 'content-type': 'application/json', 'user-agent': 'super-app', } }; var options = { headers: { 'content-type': 'application/xml' }, data: { 'key': 'value' } }; var clonedOptions = JSON.parse(JSON.stringify(options)); var result = Object.assign(defaultOptions, clonedOptions);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (4)
Previous results
Fork
Test case name
Result
lodash merge
object.assign
spread
json deep clone
Fastest:
N/A
Slowest:
N/A
Latest run results:
No previous run results
This benchmark does not have any results yet. Be the first one
to run it!
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the provided benchmark and explain what's being tested, compared, and their pros and cons. **Benchmark Overview** The benchmark compares the performance of three approaches to merge two objects: `lodash.merge`, `Object.assign`, and the spread operator (`{ ...defaultOptions, ...options }`). **Lodash Merge** * **Library:** Lodash is a popular JavaScript library that provides various utility functions. * **Purpose:** In this case, `_merge` is used to merge two objects into one. It recursively merges the properties of the second object (`options`) into the first object (`defaultOptions`). * **Pros:** + Easy to use and concise syntax. + Handles nested objects and arrays by default. * **Cons:** + Can be slower than other approaches due to its recursive nature. **Object.assign** * **Method:** `Object.assign` is a built-in JavaScript method that merges one or more source objects into a target object. * **Purpose:** In this case, it's used to merge the `options` object into the `defaultOptions` object. * **Pros:** + Fast and efficient since it uses a simple copy operation. + Works well with small to medium-sized objects. * **Cons:** + Can be slower for large or deeply nested objects due to its limited handling of arrays and nested properties. **Spread Operator** * **Method:** The spread operator (`{ ...defaultOptions, ...options }`) is a shorthand syntax that creates a new object by copying the properties from one or more source objects. * **Purpose:** In this case, it's used to merge the `options` object into the `defaultOptions` object using the spread operator. * **Pros:** + Fast and efficient since it uses a simple copy operation. + Works well with large or deeply nested objects due to its ability to handle arrays and nested properties. * **Cons:** + May be slower than `Object.assign` for very small objects due to the overhead of creating a new object. **JSON Deep Clone** This approach is not being compared in terms of performance, but rather used as a control case. It creates a deep clone of the `options` object using `JSON.parse(JSON.stringify(options))`, and then merges it into the `defaultOptions` object using `Object.assign`. * **Library:** No library is used for this approach. * **Purpose:** The purpose is to create a deep copy of the `options` object before merging it with the `defaultOptions` object. **Comparison** The benchmark compares the performance of these three approaches in terms of: 1. Number of executions per second (`ExecutionsPerSecond`) 2. Execution time (not explicitly measured, but inferred from the number of executions per second) **Other Alternatives** Some other alternatives that could be considered for merging objects include: * Using a library like Immutable.js or Ramda * Creating a custom merge function using `Object.create()` and `Object.assign()` * Using a functional programming approach with `reduce()` or `merge()` However, these alternatives are not being tested in this benchmark. Overall, the benchmark provides a good comparison of the performance characteristics of three common approaches to merging objects in JavaScript.
Related benchmarks:
lodash merge vs object.assign vs spread new obj
lodash.assign vs object.assign vs spread
Array Properties Merge: Lodash merge vs Object.assign
lodash merge vs object.assign vs spread (no intermediate vars)
lodash assign vs object.assign vs spread operator - variable and constant
Comments
Confirm delete:
Do you really want to delete benchmark?