Benchmark: Uniq ES6 vs Lodash Uniq vs Set

HTML Preparation code:


<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>

Tests:

Use ES6
const uniqArr = (arrArg) => arrArg.filter((elem, pos, arr) => arr.indexOf(elem) == pos); const arr = [1, 2, 3, 4, 5, 6, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7]; return uniqArr(arr)
Use Lodash
const arr = [1, 2, 3, 4, 5, 6, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7]; return _.uniq(arr)
Using Set
function uniq(a) { return [...new Set(a)]; } const arr = [1, 2, 3, 4, 5, 6, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7]; return uniq(arr);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Use ES6
Use Lodash
Using Set

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/119.0.0.0 Safari/537.36

Browser/OS: Chrome 119 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Use ES6	9655904.0 Ops/sec
Use Lodash	9830516.0 Ops/sec
Using Set	4733358.5 Ops/sec

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

LLMs can make mistakes. Check important info.

**What is being tested?**

On MeasureThat.net, the provided benchmark tests three different approaches to remove duplicates from an array:

1. **ES6 Filter Unique**: This approach uses the `filter()` method with a callback function that checks if the element's index (`pos`) matches its value in the original array (`arr.indexOf(elem) == pos`). If it doesn't, the element is filtered out.
2. **Lodash Uniq**: This approach uses the `uniq` function from the Lodash library to remove duplicates from an array.
3. **Using Set**: This approach uses a built-in JavaScript feature called Sets to remove duplicates from an array.

**Options being compared**

The benchmark compares these three approaches:

* **ES6 Filter Unique**: The original implementation using `filter()` and callback functions.
* **Lodash Uniq**: The implementation using Lodash's `uniq` function.
* **Using Set**: A simple implementation that converts the array to a Set, which automatically removes duplicates.

**Pros and Cons**

Here's a brief summary of the pros and cons for each approach:

1. **ES6 Filter Unique**:
	* Pros: Simple, efficient, and easy to understand.
	* Cons: Can be slow due to the use of `indexOf()` and filtering.
2. **Lodash Uniq**:
	* Pros: Fast, reliable, and well-tested library function.
	* Cons: Requires an external library, which may not be desirable in all cases.
3. **Using Set**:
	* Pros: Simple, efficient, and suitable for modern JavaScript environments.
	* Cons: May require additional setup or understanding of Sets.

**Library usage**

The benchmark uses the Lodash library for its `uniq` function. Lodash is a popular utility library that provides various functions for tasks like array manipulation, string manipulation, and more.

**Special JS feature or syntax**

This benchmark does not use any special JavaScript features or syntax beyond what's standard in modern browsers. However, it does rely on the built-in Set data structure, which is supported by most modern browsers.

**Alternatives**

If you're looking for alternative approaches to remove duplicates from an array, here are a few options:

1. **Using `Map`**: Instead of converting to a Set, you can use a `Map` object with the element as the key and its index as the value.
2. **Using a custom implementation**: You can write your own function to remove duplicates using a combination of array methods like `reduce()`, `forEach()`, or `slice()`.
3. **Using a third-party library**: There are other libraries available that provide duplicate removal functionality, such as Underscore.js or Ramda.

Keep in mind that the best approach depends on your specific use case and requirements.

Related benchmarks:

Uniq ES6 vs Lodash Uniq vs Set (version: 0)

ES6 Filter Unique vs Lodash Uniq

Comparing performance of: Use ES6 vs Use Lodash vs Using Set

Created: 2 years ago by: Guest

Jump to the latest result

Use ES6

Use Lodash

Using Set

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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