Benchmark: lodash merge vs object.assign vs spread with empty object

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 = { }; var b = { c: 'goddess' }; var c = _.merge(a, b);
object.assign
var a = { }; var b = { c: 'goddess' }; var c = Object.assign(a, b);
spread
var a = { }; var b = { c: 'goddess' }; var c = { ...a, ...b };

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
lodash merge
object.assign
spread

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

spread

12.7M/s

object.assign

4.9M/s

lodash merge

2.7M/s

View exact numbers

Test name	Executions per second
✓ spread	12,668,117 Ops/sec
object.assign	4,890,722 Ops/sec
lodash merge	2,705,456 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

**Overview**

The provided JSON represents a JavaScript microbenchmark on the website MeasureThat.net, which compares the performance of three different approaches: `_.merge` from the Lodash library, `Object.assign()`, and the spread operator (`{ ...a, ...b }`). The benchmark is designed to test how these functions merge two objects, with one object being empty (`{}`) and the other containing a single key-value pair (`{ c: 'goddess' }`).

**Approaches Compared**

The three approaches are compared in terms of their performance:

1. **_.merge()`**: This function is part of the Lodash library and is used to merge two objects recursively.
2. **Object.assign()**: This method is built-in to JavaScript and returns a new object with properties from multiple sources (arrays, objects).
3. **Spread operator (`{ ...a, ...b }`)**: This operator creates a new object by copying all enumerable own properties from one or more source objects.

**Pros and Cons of Each Approach**

1. **_.merge()**:
	* Pros: It recursively merges nested objects, making it suitable for complex data structures.
	* Cons: It has a higher overhead due to its recursive nature, which can impact performance in simple cases.
2. **Object.assign()**:
	* Pros: It is lightweight and efficient, as it only copies enumerable properties from the source objects.
	* Cons: It assumes that the source objects are arrays or objects with enumerable properties, which may not be the case for all inputs.
3. **Spread operator (`{ ...a, ...b }`)**:
	* Pros: It is concise and expressive, making it suitable for simple merge operations.
	* Cons: It has a higher overhead due to object creation and property iteration, which can impact performance in large datasets.

**Library Used**

The `_.merge()` function from Lodash is used in the benchmark. Lodash is a popular utility library that provides a set of functional programming helpers, including data manipulation functions like `_.merge()`. It is widely used for its concise and expressive way of solving common JavaScript problems.

**Special JS Features/Syntax**

None are explicitly mentioned in the provided code or benchmark results.

**Alternatives**

If you're looking for alternatives to these approaches, here are a few options:

1. **Use the `Object.assign()` method with `Array.prototype.concat()`**: This can be used as an alternative to the spread operator.
```javascript
const c = Object.assign({}, a, Array.prototype.concat(b)[0]);
```
2. **Use a custom merge function**: You can create a custom function that iterates over the properties of both objects and creates a new object with the merged values.
```javascript
function mergeObjects(a, b) {
  const result = {};
  for (const key in a) {
    if (Object.prototype.hasOwnProperty.call(b, key)) {
      result[key] = mergeObjects(a[key], b[key]);
    } else {
      result[key] = a[key];
    }
  }
  return result;
}
```
3. **Use a library like Immutable.js**: This library provides an immutable data structure that can be used to merge objects in a predictable and efficient way.

Keep in mind that the choice of approach depends on the specific requirements of your project, including performance, conciseness, and complexity handling.

lodash merge vs object.assign vs spread with empty object (version: 0)

Comparing performance of: `lodash merge vs object.assign vs spread`

Created: 2 years ago by: Guest

Go to the latest result

lodash merge

object.assign

spread

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

lodash merge vs object.assign vs spread with empty object (version: 0)

Comparing performance of: lodash merge vs object.assign vs spread

Created: 2 years ago by: Guest

Go to the latest result

lodash merge

object.assign

spread

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

Related benchmarks

Comparing performance of: `lodash merge vs object.assign vs spread`