Benchmark: _.filter vs array filter - fork

HTML Preparation code:

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.20/lodash.core.min.js"></script>

Script Preparation code:

var small_number_set = Array(10).fill(0).map(_ => Math.floor(Math.random() * 1000));

var medium_number_set = Array(1000).fill(0).map(_ => Math.floor(Math.random() * 1000));

var large_number_set = Array(1000000).fill(0).map(_ => Math.floor(Math.random() * 1000));

Tests:

large_number_set ---- _.filter
_.filter(large_number_set, num => num % 3 === 0)
large_number_set ---- array filter
large_number_set.filter(num => num % 3 === 0)
medium_number_set ---- _.filter
_.filter(medium_number_set, num => num % 3 === 0)
medium_number_set ---- array filter
medium_number_set.filter(num => num % 3 === 0)
small_number_set ---- _.filter
_.filter(small_number_set, num => num % 3 === 0)
small_number_set ---- array filter
small_number_set.filter(num => num % 3 === 0)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
large_number_set ---- _.filter
large_number_set ---- array filter
medium_number_set ---- _.filter
medium_number_set ---- array filter
small_number_set ---- _.filter
small_number_set ---- array filter

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's break down the benchmark and its test cases.

**What is being tested?**

The benchmark tests two ways of filtering an array in JavaScript:

1. Using the `_.filter()` function from the Lodash library
2. Using the native `Array.filter()` method

The filter function takes an array and a callback function as arguments, which it applies to each element in the array. The callback function should return a boolean value indicating whether the element should be included or excluded from the filtered array.

**Options compared:**

The two options being tested are:

1. `_.filter()`: This is a wrapper around the native `Array.prototype.filter()` method, but it provides additional functionality and optimizations.
2. `array filter` (native `Array.prototype.filter()`): This is the native way of filtering an array in JavaScript.

**Pros and cons:**

* `_.filter()`: Pros:
	+ Provides additional functionality and optimizations that may improve performance.
	+ Reduces boilerplate code for common use cases like filtering arrays.
* Cons:
	+ May introduce overhead due to the wrapper function.
	+ Not all browsers support Lodash, which can affect compatibility.
* `array filter` (native `Array.prototype.filter()`): Pros:
	+ Native to JavaScript, so it should be compatible with all modern browsers.
	+ Can be faster since it doesn't require a wrapper function.
* Cons:
	+ Requires more boilerplate code for common use cases like filtering arrays.

**Library used:**

The Lodash library is used in the `_.filter()` functions. Lodash is a popular utility library that provides a wide range of helper functions, including `Array.prototype.filter()`. The `_.` prefix indicates that it's a part of the Lodash library.

**Special JS feature or syntax:**

This benchmark does not use any special JavaScript features or syntax beyond what's required for the native `Array.prototype.filter()` method. It only tests the performance difference between using Lodash's wrapper function and the native method.

**Other alternatives:**

If you don't want to use Lodash, you can also use other libraries that provide a similar interface for filtering arrays, such as Underscore.js or a home-brewed implementation of `Array.prototype.filter()` in your own code. Alternatively, you could implement the filter logic yourself using native JavaScript.

Here's an example of how you might rewrite one of the test cases to use only native JavaScript:
```javascript
small_number_set.filter(num => num % 3 === 0);
```
However, this would require more boilerplate code and may not be as efficient as using Lodash's wrapper function or the native `Array.prototype.filter()` method.

Latest run results:

Run details: (Test run date: 3 years ago)

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

Browser/OS: Chrome 83 on Linux

View result in a separate tab

Test name	Executions per second
large_number_set ---- _.filter	21.9 Ops/sec
large_number_set ---- array filter	22.9 Ops/sec
medium_number_set ---- _.filter	20722.3 Ops/sec
medium_number_set ---- array filter	111705.3 Ops/sec
small_number_set ---- _.filter	925078.7 Ops/sec
small_number_set ---- array filter	4727837.5 Ops/sec

Related benchmarks:

_.filter vs array filter - fork (version: 0)

Comparing performance of: large_number_set ---- _.filter vs large_number_set ---- array filter vs medium_number_set ---- _.filter vs medium_number_set ---- array filter vs small_number_set ---- _.filter vs small_number_set ---- array filter

Created: 3 years ago by: Guest

Jump to the latest result

large_number_set ---- _.filter

large_number_set ---- array filter

medium_number_set ---- _.filter

medium_number_set ---- array filter

small_number_set ---- _.filter

small_number_set ---- array filter

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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