Benchmark: lodash unionWith vs Set for merging without duplicates

HTML Preparation code:

<script src='https://cdn.jsdelivr.net/npm/lodash@4.17.10/lodash.min.js'></script>

Tests:

Set
const first = [ {a: 3, b: 3, c: "hey"}, {a: 3, b: 2, c: "hey"}, {a: 1, b: 2, c: "bye"}, {a: 3, b: 4, c: "hey"}, {a: 2, b: 1, c: "bye"} ]; const second = [ {a: 3, b: 4, c: "hey"}, {a: 2, b: 1, c: "bye"}, {a: 4, b: 4, c: "sup"}, {a: 3, b: 3, c: "hey"} ]; return [...new Set([...first, ...second])]
unionWith
const first = [ {a: 3, b: 3, c: "hey"}, {a: 3, b: 2, c: "hey"}, {a: 1, b: 2, c: "bye"}, {a: 3, b: 4, c: "hey"}, {a: 2, b: 1, c: "bye"} ]; const second = [ {a: 3, b: 4, c: "hey"}, {a: 2, b: 1, c: "bye"}, {a: 4, b: 4, c: "sup"}, {a: 3, b: 3, c: "hey"} ]; return _.unionWith(first, second, _.isEqual);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Set
unionWith

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 29 days ago):

LLMs can make mistakes. Check important info.

**Overview**

The provided JSON represents a JavaScript microbenchmarking test case on the MeasureThat.net website. The test compares the performance of two approaches for merging arrays without duplicates: using `Set` and using the `_unionWith` function from the Lodash library.

**What is being tested?**

The benchmark tests which approach is faster when merging two arrays, `first` and `second`, to create a new array with no duplicate elements. The input arrays contain objects with multiple properties, including strings and numbers.

**Options compared**

Two options are compared:

1. **Using Set**: This approach uses the built-in `Set` data structure in JavaScript to remove duplicates from the merged array.
2. **Using Lodash `_unionWith` function**: This approach uses the `_unionWith` function from the Lodash library, which provides a more comprehensive way to merge arrays while preserving order and removing duplicates.

**Pros and Cons of each approach**

1. **Using Set**:
	* Pros: Simple, efficient, and widely supported in modern browsers.
	* Cons: May not work correctly for objects with complex properties or non-numeric values (e.g., strings). The spread operator (`...`) is used to convert the arrays to sets, which may lead to unexpected behavior if not handled carefully.
2. **Using Lodash `_unionWith` function**:
	* Pros: More comprehensive and flexible than using a simple `Set`. Preserves order of elements from both input arrays and removes duplicates efficiently.
	* Cons: Requires including the Lodash library, which may increase payload size and potentially impact performance in some cases.

**Lodash library**

The `_unionWith` function is part of the Lodash library, which provides a collection of functional programming helpers for JavaScript. The `_.isEqual` function used in the benchmark comparison ensures that objects are compared correctly when merging arrays.

**Other considerations**

When working with arrays and objects, it's essential to consider the following:

* Using `Set` can be beneficial for simple cases, but may not work correctly for complex data structures.
* Including external libraries like Lodash can impact performance and payload size.
* When using the spread operator (`...`) to convert arrays to sets or other collections, ensure that you handle any potential edge cases or unexpected behavior.

**Alternatives**

Other alternatives for merging arrays without duplicates include:

1. Using the `Array.prototype.reduce()` method with an accumulator function to combine elements while removing duplicates.
2. Utilizing a library like Immutable.js or Ramda, which provide more advanced array manipulation functions and data structures.
3. Implementing your own custom solution using vanilla JavaScript, which may be necessary for specific use cases where external libraries are not feasible.

In summary, the benchmark comparison between using `Set` and the Lodash `_unionWith` function highlights the trade-offs between simplicity, efficiency, and comprehensiveness when merging arrays without duplicates in JavaScript.

Latest run results:

Run details: (Test run date: 24 days ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36

Browser/OS: Chrome 130 on Windows

View result in a separate tab

Test name	Executions per second
Set	1664289.0 Ops/sec
unionWith	68952.1 Ops/sec

Related benchmarks:

lodash unionWith vs Set for merging without duplicates (version: 0)

Comparing performance of: Set vs unionWith

Created: 5 years ago by: Guest

Jump to the latest result

Set

unionWith

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 29 days ago):