Benchmark: dose Lodash _.union vs native Set()

HTML Preparation code:

<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@4.17.10/lodash.min.js"></script>

Script Preparation code:

var a = [1, 2, 3, 4, 5]
var b = [3, 4, 5, 6, 7]

var as = new Set(a)
var bs = new Set(b)

Tests:

_.union
var c = _.union(a, b)
Set()
var c = new Set(a, b)
Set() convert back to array
var c = new Set(a, b) var d = Array.from(c)
Set union
var c = as.union(bs)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
_.union
Set()
Set() convert back to array
Set union

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 131 on Windows

View result in a separate tab

Test name	Executions per second
_.union	5411672.0 Ops/sec
Set()	15265948.0 Ops/sec
Set() convert back to array	11734937.0 Ops/sec
Set union	12829269.0 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 15 days ago):

LLMs can make mistakes. Check important info.

The benchmark you've provided tests the performance of merging two arrays to produce a unique set of elements using different methods in JavaScript. It contrasts Lodash's `_.union` method with the native JavaScript Set object, which is a built-in feature for storing unique values. Here’s a breakdown of what’s being compared and the implications of each approach:

### Comparison of Options

1. **Lodash's `_.union`:**
   - **Benchmark Definition:** `var c = _.union(a, b)`
   - **Test Name:** `_.union`
   - **Description:** This method from the Lodash library combines two arrays and removes duplicates. Lodash is a utility library that provides various functions for array manipulation, object handling, etc.

2. **Native JavaScript `Set`:**
   - **Benchmark Definition:** `var c = new Set(a, b)`
   - **Test Name:** `Set()`
   - **Description:** This approach utilizes the native JavaScript Set constructor to create a set from the two arrays. Note that the correct way to merge and eliminate duplicates with the Set constructor would require combining the two arrays into one prior to instantiation (e.g., `new Set([...a, ...b])`).

3. **Set Convert Back to Array:**
   - **Benchmark Definition:** `var c = new Set(a, b); var d = Array.from(c)`
   - **Test Name:** `Set() convert back to array`
   - **Description:** This approach first creates a Set from the arrays and then converts it back to an array using `Array.from()`. This is a common pattern when you want unique values in array form.

4. **Set Union:**
   - **Benchmark Definition:** `var c = as.union(bs)`
   - **Test Name:** `Set union`
   - **Description:** This line attempts to call a union method on Set objects. However, note that the native Set object in JavaScript does not have a `.union` method, and this code would throw an error unless it were extended by the developer.

### Performance Results

The results show the number of executions per second for each method when tested in the same environment (Chrome 131 on Windows):

- **Set()** performed the fastest with **15,265,948 executions per second**.
- **Set union** came next at **12,829,269 executions per second**.
- **Set() convert back to array** followed with **11,734,937 executions per second**.
- **_.union** was significantly slower at **5,411,672 executions per second**.

### Pros and Cons

- **Lodash `_.union`:**
  - **Pros:** Easy to read and understand; works with various data types.
  - **Cons:** Slower performance compared to the native Set; adds a dependency on an external library.

- **Native `Set`:**
  - **Pros:** Fast performance as it's built into the JavaScript engine; no additional dependencies.
  - **Cons:** Requires knowledge of ES6; less straightforward syntax for those unfamiliar with Sets.

- **Set Convert Back to Array:**
  - **Pros:** Allows for retaining unique values in an array format post-processing.
  - **Cons:** Adds an extra step in the process which could introduce slight overhead compared to just using a Set.

- **Set Union:**
  - **Pros:** If a union method were implemented, it could be straightforward.
  - **Cons:** Native `Set` lacks this method; would require additional implementation.

### Considerations

Choosing between these approaches largely depends on your project's requirements and the data structures involved. If performance is critical and you are working in an environment that supports ES6, using the native Set is advisable. On the other hand, if you prioritize code readability, especially in projects where Lodash is already being utilized, using `_.union` might be acceptable despite its slower performance.

### Alternatives

Other alternatives to these methods include:

- **Using flatMap and filtering:** Merging and filtering unique elements manually.
- **Using array methods combined with the filter function:** For smaller datasets where readability is prioritized over performance.
- **Third-party libraries that provide similar utilities as Lodash,** but might offer better performance or smaller bundle sizes.

In summary, the best approach depends on your performance needs, the size of the datasets involved, and your codebase's existing dependencies and style preferences.

Related benchmarks:

dose Lodash _.union vs native Set() (version: 1)

Comparing performance of: _.union vs Set() vs Set() convert back to array vs Set union

Created: 15 days ago by: Guest

Jump to the latest result

_.union

Set()

Set() convert back to array

Set union

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 15 days ago):