Benchmark: JS Array IndexOf vs includes vs findIndex vs find 2

Script Preparation code:

var arr = [];
var i = 0;

while (i < 15001) arr[i] = i++;

Tests:

indexOf
const index = arr.indexOf(15000);
includes
const included = arr.includes(15000);
find
const item = arr.find(item => item === 15000);
findIndex
const index = arr.findIndex(item => item === 15000);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
indexOf
includes
find
findIndex

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 130 on Windows

View result in a separate tab

Test name	Executions per second
indexOf	790909.1 Ops/sec
includes	788998.3 Ops/sec
find	115581.2 Ops/sec
findIndex	118133.5 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 JSON and explain what is tested, compared options, pros/cons, and other considerations.

**Benchmark Definition**

The benchmark measures the performance of four different ways to find an element in a large array:

1. `arr.indexOf(15000)`
2. `arr.includes(15000)`
3. `arr.find(item => item === 15000)`
4. `arr.findIndex(item => item === 15000)`

**Script Preparation Code**

The script preparation code creates a large array of length 15,001 and populates it with integers from 0 to 14,999.

```javascript
var arr = [];
var i = 0;
while (i < 15001) arr[i] = i++;
```

This code is run before each test case to ensure a consistent baseline.

**Options Compared**

The four options compared are:

1. **`indexOf`**: Returns the index of the first occurrence of `15000` in the array.
2. **`includes`**: Returns a boolean indicating whether `15000` is included in the array.
3. **`find`**: Returns the value of the first element in the array that satisfies the provided callback function (in this case, `item => item === 15000`).
4. **`findIndex`**: Similar to `find`, but returns the index of the first occurrence instead of the value.

**Pros/Cons and Considerations**

Here's a brief summary of each option:

1. **`indexOf`**:
	* Pros: Simple, widely supported.
	* Cons: May be slower for large arrays due to linear search.
2. **`includes`**:
	* Pros: Faster than `indexOf` for large arrays (using binary search).
	* Cons: Returns a boolean value instead of an index.
3. **`find`**:
	* Pros: More flexible than `indexOf`, can be used with custom callback functions.
	* Cons: May be slower due to function call overhead.
4. **`findIndex`**:
	* Pros: Similar performance to `includes`.
	* Cons: Returns an index value instead of a boolean.

In general, for large arrays, `includes` and `findIndex` are likely to be the fastest options, followed by `indexOf`. However, if you need to perform additional operations on the found element (e.g., using `find`), it may outweigh the performance cost.

**Library Usage**

None of the provided code uses external libraries. The array manipulation is a built-in JavaScript feature.

**Special JS Features or Syntax**

The benchmark uses some advanced features:

1. **Arrow functions**: Used in the callback functions for `find` and `findIndex`.
2. **Template literals**: Not used in this example, but could be useful in more complex scenarios.
3. **Large array creation**: The script preparation code creates a large array using a while loop.

**Other Alternatives**

If you want to test other approaches, consider the following alternatives:

1. **`Array.prototype.indexOf()` with `for...of` loop**: Instead of using `while`, use a `for...of` loop to create and populate the array.
2. **`Math.random()` for element distribution**: Instead of using integers from 0 to 14,999, generate random numbers within the same range.
3. **Different data structures**: Experiment with arrays of different types (e.g., objects, dates) or alternative data structures like sets or linked lists.

Keep in mind that these alternatives may affect the benchmark's accuracy and applicability.

Related benchmarks:

JS Array IndexOf vs includes vs findIndex vs find 2 (version: 0)

Comparing performance of: indexOf vs includes vs find vs findIndex

Created: 4 years ago by: Guest

Jump to the latest result

indexOf

includes

find

findIndex

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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