Benchmark: Lodash DifferenceWith vs Native with Object and Equal

HTML Preparation code:

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

Script Preparation code:

const makeObject= (id) => {
  return { id };
}
const fillArray = (nb)=> {
  let array = [];
  for(let i = nb; i>0; i--){
    array.push(makeObject(i));
  }
  return array;
}
var oldArr = fillArray(100)

var newArr = fillArray(200)

Tests:

Native
console.log(newArr) newArr.reduce((ids, {id}) => { return ids.concat( !oldArr.some(oldItem => oldItem.id === id) ? id : [] ); }, [])
Lodash.js filter
_.differenceWith(newArr, oldArr, _.isEqual);
Native with Equal lodash
console.log(newArr) newArr.reduce((ids, obj) => { return ids.concat( !oldArr.some(oldItem => _.isEqual(oldItem, obj)) ? obj : [] ); }, [])

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Native
Lodash.js filter
Native with Equal lodash

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

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

LLMs can make mistakes. Check important info.

**Benchmark Overview**

The provided benchmark measures the performance of two approaches to find the difference between two arrays: using native JavaScript functions and using Lodash's `differenceWith` function.

**Benchmark Definition JSON**

The benchmark definition is represented by a JSON object with the following properties:

* `Name`: A unique name for the benchmark.
* `Description`: An optional description of the benchmark (in this case, null).
* `Script Preparation Code`: A JavaScript code snippet that prepares the test data and variables. In this case, it creates two arrays (`oldArr` and `newArr`) using a custom function `fillArray`.
* `Html Preparation Code`: A HTML code snippet that includes the Lodash library (version 4.17.4) to be used in the benchmark.

**Individual Test Cases**

There are three individual test cases:

1. **Native**: This test case uses native JavaScript functions to find the difference between the two arrays.
2. **Lodash.js filter**: This test case uses Lodash's `differenceWith` function with a custom equality check (`_.isEqual`) to find the difference between the two arrays.
3. **Native with Equal lodash**: This test case uses native JavaScript functions and includes the `_.isEqual` function from Lodash for an additional optimization.

**What is tested**

The benchmark tests the performance of each approach:

* Native JavaScript functions:
	+ `console.log(newArr)`
	+ `newArr.reduce((ids, {id}) => {...})`
	+ `oldArr.some(oldItem => oldItem.id === id) ? id : []` (in the `differenceWith` implementation)
* Lodash's `differenceWith` function with a custom equality check (`_.isEqual`):
	+ `_.differenceWith(newArr, oldArr, _.isEqual)`
* Native JavaScript functions and Lodash's `_.isEqual` function:
	+ `console.log(newArr)`
	+ `newArr.reduce((ids, obj) => {...})`
	+ `_oldArr.some(oldItem => _.isEqual(oldItem, obj)) ? obj : []`

**Pros and Cons of each approach**

1. **Native JavaScript functions**:
	* Pros: No additional dependencies or overhead.
	* Cons: Can be slower due to the need to iterate over the arrays using `some` and indexing.
2. **Lodash's `differenceWith` function with custom equality check (`_.isEqual`)**:
	* Pros: Faster than native JavaScript functions for large datasets, as it uses optimized algorithms.
	* Cons: Requires Lodash library and additional dependencies.
3. **Native JavaScript functions and Lodash's `_.isEqual` function**:
	* Pros: Combines the benefits of both approaches (fast performance with minimal overhead).
	* Cons: Still requires some performance optimization for large datasets.

**Other considerations**

* The benchmark uses Chrome 110 browser and Windows operating system.
* The test cases use a custom equality check (`_.isEqual`) to compare objects in Lodash's `differenceWith` function.
* The benchmark does not mention any special JavaScript features or syntax, so it should be accessible to a wide range of software engineers.

**Alternatives**

Other alternatives for finding the difference between two arrays include:

* Using other libraries like `lodash-es` (which is optimized for ES modules) or `picky` (a smaller and faster library).
* Implementing your own custom equality check using native JavaScript functions.
* Using a different approach, such as using `Set` data structure to store unique elements.

Related benchmarks:

Lodash DifferenceWith vs Native with Object and Equal (version: 0)

Comparing performance of: Native vs Lodash.js filter vs Native with Equal lodash

Created: 3 years ago by: Guest

Jump to the latest result

Native

Lodash.js filter

Native with Equal lodash

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

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