Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
Feature Requests
FAQ
Register
Log In
lodash merge vs object.assign vs spread with arraysj
(version: 0)
Benchmark.js
Comparing performance of:
lodash assign vs object.assign vs spread
Created:
7 years ago
by:
Guest
Go 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 assign
var a = { a: 'oh', b: [1, 2, 3] }; var b = { b: [2, 3, 4] }; var c = _.assign({}, a, b);
object.assign
var a = { a: 'oh', b: [1, 2, 3] }; var b = { b: [2, 3, 4] }; var c = Object.assign({}, a, b);
spread
var a = { a: 'oh', b: [1, 2, 3] }; var b = { b: [2, 3, 4] }; var c = { ...a, ...b };
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
lodash assign
object.assign
spread
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
5 months ago
)
User agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/140.0.0.0 Safari/537.36
Browser/OS:
Chrome 140 on Windows
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=627171" width="100%" height="500px"></iframe>
spread
16.3M/s
object.assign
9.3M/s
lodash assign
3.4M/s
View exact numbers
Test name
Executions per second
✓
spread
16,305,028 Ops/sec
object.assign
9,274,050 Ops/sec
lodash assign
3,371,020 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's dive into the explanation of the provided benchmark. **What is being tested?** The benchmark is testing three approaches to merge two objects in JavaScript: 1. **Lodash `_.assign()`**: This method takes two or more sources and merges them into an object, overwriting any existing properties. 2. **Object.assign()**: This method takes one or more source objects and merges them into a target object, overwriting any existing properties. 3. **Spread operator (`...`)**: This is a new syntax in JavaScript that allows you to merge two objects into a new object by spreading the properties of each object. **Options compared** The benchmark is comparing these three approaches on a specific test case: * Create an object `a` with one property `b` containing an array `[1, 2, 3]`. * Create another object `b` with the same property `b` but with a different array `[2, 3, 4]`. * Merge `a` and `b` into a new object using each of the three approaches. **Pros and cons of each approach** 1. **Lodash `.assign()`**: This method is fast and efficient, as it uses a specialized algorithm for merging objects. However, it requires an external library (Lodash) to be included. 2. **Object.assign()**: This method is also efficient, but it requires the use of `null` values to preserve the original object's properties. It's also more concise than writing a custom merge function. 3. **Spread operator (`...`)**: This syntax is very concise and easy to read, but it can be slower than the other two approaches, as it involves creating new objects. **Library usage** The benchmark uses Lodash for the `.assign()` method. The `lodash.min.js` library is included in the HTML file using a `<script>` tag. **Special JS feature/syntax** None mentioned in the provided benchmark code. **Other considerations** * The benchmark is running on Firefox 62, which may not be the most up-to-date browser version. * The test cases are quite simple and don't cover edge cases, such as merging objects with duplicate properties or using `null` values. * The benchmark doesn't account for potential memory allocation overhead of creating new objects. **Alternative approaches** Other methods to merge two objects include: 1. **Custom recursive function**: Writing a custom function that recursively merges the properties of two objects. 2. **Using `for...in` loops**: Using `for...in` loops to iterate over the properties of an object and merging them using conditional statements. These alternative approaches may be slower than the benchmarked methods, but they provide more control over the merge process. I hope this explanation helps!
Related benchmarks
lodash merge vs object.assign vs spread new obj
lodash.assign vs object.assign vs spread
lodash assign vs object.assign vs spread operator - variable and constant
Comments
Confirm delete:
Do you really want to delete benchmark?