Benchmark: lodash difference vs ES6 Set (large set)

HTML Preparation code:

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

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

Script Preparation code:

var arr1 = [];
for(let i = 0; i < 10000; i++) {
  arr1.push('' + i);
}

var arr2 = [];
for(let i = 499; i >= 0; i--) {
  arr2.push('' + i);
}

​x
 
var arr1 = [];for(let i = 0; i < 10000; i++) {  arr1.push('' + i);}​var arr2 = [];for(let i = 499; i >= 0; i--) {  arr2.push('' + i);}

Tests:

_difference
const finalArray1 = _.difference(arr1, arr2) const finalArray2 = _.difference(arr2, arr1)
const finalArray1 = _.difference(arr1, arr2)
const finalArray2 = _.difference(arr2, arr1)

Set/Filter

const outList2 = new Set([...arr2]);
const outList1 = new Set([...arr1]);
const finalArray1 = arr1.filter(value => !outList2.has(value));
const finalArray2 = arr2.filter(value => !outList1.has(value));

 
const outList2 = new Set([...arr2]);const outList1 = new Set([...arr1]);const finalArray1 = arr1.filter(value => !outList2.has(value));const finalArray2 = arr2.filter(value => !outList1.has(value));​

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

Memory measurements supported only in Chrome.
For precise memory measurements Chrome must be launched with --enable-precise-memory-info flag.
More information: Monitoring JavaScript Memory

Test case name	Result
_difference
Set/Filter

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

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

Browser/OS: Chrome 123 on Linux

View result in a separate tab

Test name	Executions per second
_difference	1505.1 Ops/sec
Set/Filter	1762.5 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated 5 months ago):

I'll break down the benchmark and its results, explaining what's being tested, the different approaches, their pros and cons, and other considerations.

Benchmark Definition

The benchmark tests two ways to find the difference between two arrays: using Lodash's _difference function and using JavaScript's built-in Set data structure with filtering.

Script Preparation Code

The script generates two large arrays:

arr1: an array of 10,000 elements from 0 to 9,999 (inclusive).
arr2: an array of 5,000 elements from 500 to -499 (inclusive).

These arrays are used as input for the benchmark.

Html Preparation Code

The HTML code includes a script tag that loads the Lodash library version 4.17.5.

Individual Test Cases

There are two test cases:

_difference

This test case uses Lodash's _difference function to find the difference between arr1 and arr2. The resulting arrays are stored in finalArray1 and finalArray2.

Set/Filter

This test case uses JavaScript's built-in Set data structure to find the difference between arr1 and arr2. It creates two sets from the input arrays, then filters out elements that exist in both sets using the filter() method. The resulting filtered arrays are stored in finalArray1 and finalArray2.

Pros and Cons of each approach

Lodash's _difference function:
- Pros: concise and easy to read.
- Cons: relies on a library, which may not be included by default in all environments.
JavaScript's Set data structure with filtering:
- Pros: fast and efficient, uses built-in data structures.
- Cons: requires understanding of Set operations and filtering.

Library: Lodash

Lodash is a popular utility library for JavaScript that provides a wide range of functions for tasks like string manipulation, array manipulation, and more. The _difference function is part of Lodash's collection of array utilities.

Special JS feature or syntax: None

There are no special JavaScript features or syntax used in this benchmark.

Other considerations

Performance: The performance of these two approaches may vary depending on the specific use case and input data.
Readability: The concise and readable nature of Lodash's _difference function may make it more appealing for quick development, but it may also hide underlying complexities.
Security: Using a library like Lodash can introduce security risks if not used carefully. In this benchmark, however, the code appears to be safe.

Alternatives

Other alternatives for finding array differences include:

Array.prototype.filter() and Array.prototype.find()
A custom implementation using loops and conditional statements
Other libraries or frameworks that provide similar functionality (e.g., Ramda)

Note that the choice of approach depends on the specific requirements of the project, such as performance, readability, and maintainability.

LLMs can make mistakes. Check important info.

I'll break down the benchmark and its results, explaining what's being tested, the different approaches, their pros and cons, and other considerations.

**Benchmark Definition**

The benchmark tests two ways to find the difference between two arrays: using Lodash's `_difference` function and using JavaScript's built-in `Set` data structure with filtering.

**Script Preparation Code**

The script generates two large arrays:

* `arr1`: an array of 10,000 elements from 0 to 9,999 (inclusive).
* `arr2`: an array of 5,000 elements from 500 to -499 (inclusive).

These arrays are used as input for the benchmark.

**Html Preparation Code**

The HTML code includes a script tag that loads the Lodash library version 4.17.5.

**Individual Test Cases**

There are two test cases:

### _difference

This test case uses Lodash's `_difference` function to find the difference between `arr1` and `arr2`. The resulting arrays are stored in `finalArray1` and `finalArray2`.

### Set/Filter

This test case uses JavaScript's built-in `Set` data structure to find the difference between `arr1` and `arr2`. It creates two sets from the input arrays, then filters out elements that exist in both sets using the `filter()` method. The resulting filtered arrays are stored in `finalArray1` and `finalArray2`.

**Pros and Cons of each approach**

* Lodash's `_difference` function:
	+ Pros: concise and easy to read.
	+ Cons: relies on a library, which may not be included by default in all environments.
* JavaScript's Set data structure with filtering:
	+ Pros: fast and efficient, uses built-in data structures.
	+ Cons: requires understanding of Set operations and filtering.

**Library: Lodash**

Lodash is a popular utility library for JavaScript that provides a wide range of functions for tasks like string manipulation, array manipulation, and more. The `_difference` function is part of Lodash's collection of array utilities.

**Special JS feature or syntax: None**

There are no special JavaScript features or syntax used in this benchmark.

**Other considerations**

* Performance: The performance of these two approaches may vary depending on the specific use case and input data.
* Readability: The concise and readable nature of Lodash's `_difference` function may make it more appealing for quick development, but it may also hide underlying complexities.
* Security: Using a library like Lodash can introduce security risks if not used carefully. In this benchmark, however, the code appears to be safe.

**Alternatives**

Other alternatives for finding array differences include:

* `Array.prototype.filter()` and `Array.prototype.find()`
* A custom implementation using loops and conditional statements
* Other libraries or frameworks that provide similar functionality (e.g., Ramda)

Note that the choice of approach depends on the specific requirements of the project, such as performance, readability, and maintainability.

Related benchmarks:

lodash difference vs ES6 Set (large set) (version: 0)

Comparing performance of: _difference vs Set/Filter

Created: 2 years ago by: Guest

Jump to the latest result

_difference

Set/Filter

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 5 months ago):

_difference

Set/Filter