Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
merge vs mergeWith vs object.assign vs spread12
(version: 0)
Comparing performance of:
lodash merge vs object.assign vs spread vs lodash mergeWith
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>
Tests:
lodash merge
var a = { a: 'oh', b: 'my', d: 'ss' }; var b = { c: 'goddess', d: 's2s' }; var c = _.merge(a, b); console.log('merge', c)
object.assign
var a = { a: 'oh', b: 'my', d: 'ss' }; var b = { c: 'goddess', d: 's2s' }; var c = Object.assign(a, b); console.log('assign', c)
spread
var a = { a: 'oh', b: 'my', d: 'ss' }; var b = { c: 'goddess', d: 's2s' }; var c = { ...a, ...b }; console.log('spread', c)
lodash mergeWith
var a = { a: 'oh', b: 'my', d: 'ss' }; var b = { c: 'goddess', d: 's2s' }; var c = _.mergeWith(a, b); console.log('mergeWith', c)
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
lodash mergeWith
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
11 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 merge
603145.4 Ops/sec
object.assign
180549.7 Ops/sec
spread
140770.1 Ops/sec
lodash mergeWith
206321.2 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the benchmark and its test cases. **Overview of the Benchmark** The benchmark is designed to compare the performance of four different methods for merging two objects: `merge`, `mergeWith`, `object.assign`, and `spread`. The tests are conducted using JavaScript and utilize the Lodash library, which provides utility functions for tasks such as array and object manipulation. **Options Compared** Here's a brief overview of each option: * **`merge`**: This method merges two objects recursively. It returns a new object with the properties from both input objects. * **`mergeWith`**: This method is similar to `merge`, but it takes an additional function as the first argument, which is called for each property in the source object. This allows for more control over the merging process. * **`object.assign()`**: This is a built-in JavaScript method that merges two or more objects into one. It returns a new object with the properties from all input objects. * **`spread` (also known as `Object spread operator`)**: This method creates a new object by spreading the properties of another object into it. It uses the syntax `{ ...obj }` to create a new object. **Pros and Cons** Here are some pros and cons for each option: * **`merge`**: + Pros: Simple, intuitive, and widely supported. + Cons: Can lead to performance issues if dealing with large objects or complex data structures. * **`mergeWith`**: + Pros: Provides more control over the merging process, which can be useful in certain scenarios. + Cons: Adds complexity and may require additional setup. * **`object.assign()`**: + Pros: Built-in method, widely supported, and simple to use. + Cons: Can lead to issues with prototype chains or object inheritance. * **`spread`**: + Pros: Simple, intuitive, and modern syntax. + Cons: Only available in recent browsers (ES6+), and may not work in older environments. **Lodash Library** The Lodash library is a popular JavaScript utility library that provides a wide range of functions for tasks such as array manipulation, object merging, and more. The `merge` function is part of the Lodash library and is used to merge two objects recursively. **Other Considerations** When choosing between these methods, consider the following factors: * **Complexity**: If you need to deal with complex data structures or large objects, `mergeWith` might be a better choice. * **Performance**: If performance is critical, `object.assign()` and `spread` are likely your best bets due to their optimized implementation. * **Browser Support**: If you need to support older browsers, you may need to use alternative methods like `object.assign()` or `mergeWith`. * **Syntax**: The syntax for each method can affect readability and maintainability. Choose the one that fits your team's coding style. **Alternatives** If none of these options work for you, consider using other methods: * **`Array.prototype.reduce()`**: Can be used to merge objects by reducing an array of key-value pairs. * **`JSON.parse(JSON.stringify(obj))`**: A creative approach to merging objects by stringifying and then parsing the object as JSON. However, keep in mind that these alternatives might not provide the same level of control or performance as the methods listed above.
Related benchmarks:
lodash merge vs object.assign vs spread new obj
lodash.assign vs object.assign vs spread
lodash merge vs object.assign vs spread overwriting one property
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?