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; });

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: 7 days ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36

Browser/OS: Chrome 131 on Windows

View result in a separate tab

Test name	Executions per second
Array.includes	1092.2 Ops/sec
Array.includes (cached array)	609.8 Ops/sec
OR operator	219.5 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated one month 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.

Related benchmarks:

Array.includes vs OR operator (version: 0)

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: 2 years ago by: Guest

Jump to the latest result

Array.includes

Array.includes (cached array)

OR operator

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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