Benchmark: Remove duplicate: Pure JS VS Lodash

HTML Preparation code:

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

Script Preparation code:

var arr = [
  {
   id: 123,
   name: "abc",
  },
  {
   id: 1234,
   name: "abcd",
  },
  {
   id: 123,
   name: "abc",
  },
  {
    id: 4321,
    name: 'dcba',
  },
];

var key='id';

Tests:

Pure JS: map
var indexArray = []; var newArray = arr.map(a => { if (indexArray.indexOf(a[key]) < 0) { indexArray.push(a[key]); return a; }; return -1; }).filter(a => a != -1);
Pure JS: forEach
var indexArray = []; var newArray = []; arr.forEach(a => { if (indexArray.indexOf(a[key]) < 0) { indexArray.push(a[key]); newArray.push(a); }});
Lodash: uniqBy
var newArray = _.uniqBy(arr, key);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Pure JS: map
Pure JS: forEach
Lodash: uniqBy

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's break down what's being tested in the provided JSON.

The test is comparing two approaches to remove duplicates from an array using JavaScript:

1. **Pure JavaScript**: Using `map()` and `filter()`
2. **Lodash**: Using the `uniqBy()` function from the Lodash library

**Pure JavaScript: map**

The benchmark definition uses the following code:
```javascript
var indexArray = [];
var newArray = arr.map(a => {
  if (indexArray.indexOf(a[key]) < 0) {
    indexArray.push(a[key]);
    return a;
  }
  return -1;
}).filter(a => a != -1);
```
Here's what's happening:

* We initialize an empty `indexArray` to keep track of unique values.
* We use `map()` to create a new array, `newArray`, with transformed elements.
* For each element `a` in the original array, we check if its value (`a[key]`) is already present in `indexArray`. If not, we add it to `indexArray` and return the original element `a`.
* If the value is already present, we return `-1` to indicate that it's a duplicate.

**Pros:**

* No additional dependencies (no Lodash library)
* Can be more efficient for small datasets

**Cons:**

* Can be slower for large datasets due to the overhead of the `indexOf()` method and the need to iterate over the entire array.
* More verbose code compared to using a built-in function like `uniqBy()`.

**Lodash: uniqBy**

The benchmark definition uses the following code:
```javascript
var newArray = _.uniqBy(arr, key);
```
Here's what's happening:

* We import the Lodash library and use its `uniqBy()` function.
* The `uniqBy()` function takes two arguments: the array to process (`arr`) and a function that extracts the unique value from each element (in this case, `key`).

The `uniqBy()` function uses a similar approach as the Pure JavaScript implementation:

1. It creates an empty object to keep track of unique values.
2. For each element in the original array, it checks if its value is already present in the object. If not, it adds it to the object and returns the original element.

**Pros:**

* Built-in function in Lodash library makes it easier to use
* Can be more efficient for large datasets due to optimized implementation

**Cons:**

* Requires additional dependencies (Lodash library)
* May have a higher overhead compared to Pure JavaScript implementation

Now, let's look at the benchmark results:

The latest results show that:

1. **Lodash: uniqBy** is the fastest approach with an average execution rate of 9033602 executions per second.
2. **Pure JS: forEach** comes in second with an average execution rate of 8593202 executions per second.
3. **Pure JS: map** is the slowest approach with an average execution rate of 2067486.25 executions per second.

Other alternatives to consider:

* Using `Set` data structure instead of arrays or objects for storing unique values.
* Implementing a custom solution using a hash table or other data structures.
* Comparing other approaches, such as using `filter()` with an initial value of 0 or using `reduce()`.

Keep in mind that the choice of approach depends on specific use cases and requirements.

Latest run results:

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

User agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36

Browser/OS: Chrome 130 on Linux

View result in a separate tab

Test name	Executions per second
Pure JS: map	885628.6 Ops/sec
Pure JS: forEach	1108264.6 Ops/sec
Lodash: uniqBy	2463656.2 Ops/sec

Related benchmarks:

Remove duplicate: Pure JS VS Lodash (version: 0)

Comparing performance of: Pure JS: map vs Pure JS: forEach vs Lodash: uniqBy

Created: 4 years ago by: Registered User

Jump to the latest result

Pure JS: map

Pure JS: forEach

Lodash: uniqBy

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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