Benchmark: js includes inside filter

Script Preparation code:

var options = [1,2,3,4,5,6]

Tests:

filter
return options.filter((option) => option !== 1 && option !== 2)
includes
return options.filter((option) => ![1,2].includes(option))

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
filter
includes

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/85.0.4183.102 Safari/537.36

Browser/OS: Chrome 85 on Mac OS X 10.15.5

View result in a separate tab

Test name	Executions per second
filter	11225075.0 Ops/sec
includes	8227864.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what's being tested.

**Benchmark Overview**

The benchmark is designed to test the performance of JavaScript filters, specifically comparing two approaches: using the `filter()` method with an arrow function and using the `includes()` method with an array literal.

**Script Preparation Code**

The script preparation code defines a variable `options` containing six numbers:
```javascript
var options = [1, 2, 3, 4, 5, 6];
```
This script is executed before running each test case. The purpose of this code is to provide a common input set for both test cases.

**Html Preparation Code**

The html preparation code is empty (`null`), which means that no HTML-related setup or cleanup is performed during the benchmarking process.

**Test Cases**

There are two test cases:

1. **filter**: This test case defines a function as follows:
```javascript
return options.filter((option) => option !== 1 && option !== 2);
```
This function uses the `filter()` method with an arrow function to create a new array containing only the elements from `options` that are not equal to 1 or 2.

2. **includes**: This test case defines a function as follows:
```javascript
return options.filter((option) => ![1,2].includes(option));
```
This function uses the `filter()` method with an arrow function and the `includes()` method to create a new array containing only the elements from `options` that are not present in the array `[1, 2]`.

**Library and Features**

In this benchmark, no specific JavaScript library is used. However, some general features are utilized:

* **Arrow functions**: Both test cases use arrow functions (`(option) => ...`) as a concise way to define small anonymous functions.
* **Filter() method**: This method is used in both test cases to create new arrays based on conditions.

**Alternative Approaches**

If you were to reimplement these benchmark tests, here are alternative approaches to consider:

1. Using `forEach()` instead of `filter()`: You could use a loop (`forEach()`) to iterate over the array and push elements to a result array that meet the condition.
```javascript
return options.filter((option) => option !== 1 && option !== 2);
// equivalent using forEach()
const result = [];
options.forEach((option) => {
  if (option !== 1 && option !== 2) {
    result.push(option);
  }
});
```
However, this approach would likely have a slower execution time than the `filter()` method.

2. Using `Map` or `Set` instead of `Array`: You could use a `Map` or `Set` to store unique values and then filter them using the same conditions.
```javascript
// equivalent using Map
const map = new Map();
options.forEach((option) => {
  if (option !== 1 && option !== 2) {
    map.set(option, true);
  }
});
return [...map.keys()];
```
However, this approach would likely have a slower execution time than the `filter()` method due to the overhead of creating and manipulating Maps/Sets.

3. Using native `Array.prototype.some()` instead of `includes()`: You could use the `some()` method to check if any element in the array matches a certain condition.
```javascript
return options.filter((option) => !options.includes(option));
// equivalent using some()
const result = [];
options.forEach((option) => {
  if (!options.some((o) => o === option)) {
    result.push(option);
  }
});
```
However, this approach would likely have a slower execution time than the `includes()` method due to the overhead of calling `some()` on each element.

These alternative approaches can provide insight into how different methods perform under various conditions. However, in general, the `filter()` method remains one of the most efficient ways to filter arrays in JavaScript.

Related benchmarks:

js includes inside filter (version: 0)

Comparing performance of: filter vs includes

Created: 4 years ago by: Guest

Jump to the latest result

filter

includes

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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