Benchmark: Array.includes vs Array.find vs Array.indexOf

Script Preparation code:

var values = []
for (var i = 0; i < 1000000; i++) {
  values.push[i]
}

Tests:

Array.find
var TEST_NUM = 897495 var result = values.find(v => v === TEST_NUM)
Array.includes
var TEST_NUM = 897495 var result = values.includes(TEST_NUM)
Array.indexOf
var TEST_NUM = 897495 var result = values.indexOf(TEST_NUM) !== -1

Historical Performance Data aggregated from 19 community runs

Desktop Results:

Chrome 12 runs

Array.includes

83.3M/s

Array.indexOf

81.1M/s

Array.find

75.9M/s

View exact numbers

✓ Array.includes: 83,275,680 ops/sec
• Array.indexOf: 81,110,176 ops/sec
• Array.find: 75,938,528 ops/sec

Firefox 7 runs

Array.find

128.7M/s

Array.includes

69.6M/s

Array.indexOf

68.7M/s

Fastest: Array.find (1.9x faster)

View exact numbers

✓ Array.find: 128,734,256 ops/sec
• Array.includes: 69,576,456 ops/sec
• Array.indexOf: 68,693,704 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.find
Array.includes
Array.indexOf

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 2 months ago)

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

Browser/OS: Chrome 149 on Linux

View result in a separate tab

Array.includes

42.3M/s

Array.indexOf

39.3M/s

Array.find

26.0M/s

View exact numbers

Test name	Executions per second
✓ Array.includes	42,257,296 Ops/sec
Array.indexOf	39,262,300 Ops/sec
Array.find	25,988,472 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.

**Benchmark Definition**

The benchmark measures the performance of three different methods for finding an element in an array: `Array.includes`, `Array.indexOf`, and `Array.find`. These methods are all used to search for a specific value within the large array created by the script preparation code.

**Script Preparation Code**

The script generates a large array of 1 million elements, each with a unique index. This is done using a simple JavaScript loop:
```javascript
for (var i = 0; i < 1000000; i++) {
  values.push[i] = i;
}
```
This creates an array where each element has the same value as its index.

**Html Preparation Code**

There is no HTML preparation code provided, so we can assume that this benchmark only tests JavaScript performance and does not involve any web page rendering or other external factors.

**Individual Test Cases**

The three test cases are:

1. `Array.find`: This method uses a callback function to find the first element in the array that satisfies a condition.
```javascript
var TEST_NUM = 897495;
var result = values.find(v => v === TEST_NUM);
```
2. `Array.includes`: This method checks if an element with the specified value exists in the array.
```javascript
var TEST_NUM = 897495;
var result = values.includes(TEST_NUM);
```
3. `Array.indexOf`: This method returns the index of the first occurrence of the specified value, or -1 if it is not found.
```javascript
var TEST_NUM = 897495;
var result = values.indexOf(TEST_NUM) !== -1;
```
**Pros and Cons**

Here's a brief summary of each method:

* `Array.includes`:
	+ Pros: Simple and efficient, with an average time complexity of O(n).
	+ Cons: May not be suitable for large arrays or performance-critical applications.
* `Array.indexOf`:
	+ Pros: Can be used to find the index of any element, not just a specific value.
	+ Cons: Returns -1 if the element is not found, which may require additional checks in some cases. Average time complexity is O(n).
* `Array.find`:
	+ Pros: Finds the first matching element and returns it, making it useful for searching arrays.
	+ Cons: May be slower than `includes` or `indexOf` due to its extra overhead. Average time complexity is O(n).

**Library and Syntax**

There are no libraries used in this benchmark.

**Special JS Features**

None mentioned.

**Other Alternatives**

Some alternative methods for finding an element in an array include:

* Using a `for` loop with indexing: `var result = 0; while (result < values.length && values[result] !== TEST_NUM) { result++; }`
* Using the `includes()` method with a callback function: `values.includes(v => v === TEST_NUM)`
* Using the `some()` and `findIndex()` methods: `values.some((v, i) => v === TEST_NUM);` or `values.findIndex((v, i) => v === TEST_NUM)`

However, these alternatives are not part of the standard JavaScript array API and may have different performance characteristics.

Array.includes vs Array.find vs Array.indexOf (version: 0) Benchmark.js

Comparing performance of: `Array.find vs Array.includes vs Array.indexOf`

Created: 5 years ago by: Guest

Go to the latest result

Array.find

Array.includes

Array.indexOf

Historical Performance Data aggregated from 19 community runs

Desktop Results:

Chrome 12 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 Array.find vs Array.indexOf (version: 0) Benchmark.js

Comparing performance of: Array.find vs Array.includes vs Array.indexOf

Created: 5 years ago by: Guest

Go to the latest result

Array.find

Array.includes

Array.indexOf

Historical Performance Data aggregated from 19 community runs

Desktop Results:

Chrome 12 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.find vs Array.includes vs Array.indexOf`