Benchmark: Array.includes vs OR operator

Script Preparation code:

var data = [...Array(10000)].map((_, i) => [i, i]);
var cachedArray = ['a', 'b', 'c', 'd', 'e', 'f'];
var g = 'g';

Tests:

Array.includes
data.forEach(() => { return ['a', 'b', 'c', 'd', 'e', 'f'].includes(g); });
Array.includes (cached array)
data.forEach(() => { return cachedArray.includes(g); });
OR operator
data.forEach(() => { return 'a' === g || 'b' === g || 'c' === g || 'd' === g || 'e' === g || 'f' === g; });

Historical Performance Data aggregated from 30 community runs

Desktop Results:

Chrome 23 runs

Array.includes

2K/s

Array.includes (cached array)

1K/s

OR operator

528/s

Fastest: Array.includes (4.1x faster)

View exact numbers

✓ Array.includes: 2,152 ops/sec
• Array.includes (cached array): 1,293 ops/sec
• OR operator: 528 ops/sec

Firefox 7 runs

OR operator

9K/s

Array.includes (cached array)

3K/s

Array.includes

2K/s

Fastest: OR operator (3.8x faster)

View exact numbers

✓ OR operator: 8,569 ops/sec
• Array.includes (cached array): 2,903 ops/sec
• Array.includes: 2,264 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.includes
Array.includes (cached array)
OR operator

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 137 on Mac OS X 10.15.7

View result in a separate tab

OR operator

291K/s

Array.includes (cached array)

14K/s

Array.includes

14K/s

View exact numbers

Test name	Executions per second
✓ OR operator	290,821 Ops/sec
Array.includes (cached array)	13,850 Ops/sec
Array.includes	13,679 Ops/sec

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

LLMs can make mistakes. Check important info.

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

**Benchmark Definition**
The test case is designed to compare the performance of two approaches: using `Array.includes()` with a cached array, and using an OR operator (`||`) to check for membership in an array. The goal is to determine which approach is more performant.

**Script Preparation Code**
The script prepares an array `data` with 10,000 elements, each containing a value from the string `'a'` to `'f'`. A cached array `cachedArray` is also created with the same values as `data`.

**Html Preparation Code**
There is no HTML preparation code provided.

**Individual Test Cases**

1. **Array.includes**: This test case uses `Array.includes()` with a dynamic value `g` which is assigned to `'a'`. The script iterates over an array of 10,000 elements using the `forEach()` method and checks if each element's first value (using `data[i][0]`) includes `g`.
2. **Array.includes (cached array)**: This test case uses `Array.includes()` with a cached array `cachedArray` containing the same values as `data`. The script iterates over an array of 10,000 elements using the `forEach()` method and checks if each element's first value includes `g`.
3. **OR operator**: This test case uses an OR operator (`||`) to check for membership in an array with dynamic values. The script iterates over an array of 10,000 elements using the `forEach()` method and checks if any of the values match `g`.

**Library Used**
There is no explicit library mentioned in the benchmark definition or test cases. However, it's worth noting that `Array.includes()` is a built-in JavaScript method.

**Special JS Features/ Syntax**
The benchmark makes use of several features:

* **Arrow functions**: The script uses arrow functions (`() => { ... }`) to define small anonymous functions.
* **Template literals**: The script uses template literals (`[i, i]`) to create arrays with dynamic values.
* **Dynamic variable assignment**: The script assigns a value `g` which is later used as a string literal.

**Pros and Cons of Different Approaches**

1. **Array.includes() with cached array**:
	* Pros: Can be faster than the OR operator approach due to caching.
	* Cons: Requires extra memory allocation for the cached array, which might not be negligible for very large datasets.
2. **OR operator**:
	* Pros: Does not require additional memory allocation or complex logic.
	* Cons: Might be slower than `Array.includes()` with a cached array due to its iterative nature.

**Other Alternatives**
If you're interested in exploring alternative approaches, here are a few options:

1. **Regular expressions**: You could use regular expressions (e.g., `/g` flag) to search for a value in an array.
2. **Binary search**: If the array is sorted, you could use binary search algorithms to find a value in O(log n) time complexity.

Keep in mind that these alternatives might not provide the same performance benefits as `Array.includes()` with a cached array or the OR operator approach.

Array.includes vs OR operator (version: 0) Benchmark.js

Array.includes may be more readable, but is it more performant?

Comparing performance of: `Array.includes vs Array.includes (cached array) vs OR operator`

Created: 4 years ago by: Guest

Go to the latest result

Array.includes

Array.includes (cached array)

OR operator

Historical Performance Data aggregated from 30 community runs

Desktop Results:

Chrome 23 runs

Firefox 7 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Array.includes vs OR operator (version: 0) Benchmark.js

Array.includes may be more readable, but is it more performant?

Comparing performance of: Array.includes vs Array.includes (cached array) vs OR operator

Created: 4 years ago by: Guest

Go to the latest result

Array.includes

Array.includes (cached array)

OR operator

Historical Performance Data aggregated from 30 community runs

Desktop Results:

Chrome 23 runs

Firefox 7 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

Comparing performance of: `Array.includes vs Array.includes (cached array) vs OR operator`