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

Script Preparation code:

var arr = [];
var i = 0;

while (i < 15001) {arr[i] ={id:i}; i++};

Tests:

includes
const arrId=arr.map(d=>d.id); const included = arrId.includes(15000);
find
const item = arr.find(item => item.id === "15000");
findIndex
const index = arr.findIndex(item => item.id === "15000");

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
includes
find
findIndex

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

I'll break down the provided benchmark JSON and explain what's being tested, compared, and their pros and cons.

**Benchmark Overview**

The provided benchmark is designed to compare the performance of three methods in JavaScript: `indexOf`, `includes`, and `findIndex`. These methods are used to search for an element within an array. The test creates a large array (15001 elements) with IDs ranging from 0 to 15000.

**Methods Compared**

1. **`arr.indexOf(15000)`**: This method returns the index of the first occurrence of the specified value (`15000`) in the array.
2. **`Array.prototype.includes()`**: This method checks if a specific value (`15000`) is present in the array. If found, it returns `true`, otherwise `false`.
3. **`arr.findIndex(item => item.id === "15000")`**: This method finds the index of the first element that satisfies the provided condition (in this case, `item.id === "15000"`).

**Library Used**

None.

**Special JS Features/Syntax**

The benchmark uses a shorthand syntax for arrow functions (`=>`) and template literals (`\```).

**Pros and Cons of Each Approach**

1. **`arr.indexOf(15000)`**
	* Pros: Can be optimized by the V8 engine (the JavaScript engine used in Chrome) to use a linear search.
	* Cons:
		+ May not be as efficient for large arrays due to the linear search algorithm.
		+ Can throw an error if `15000` is not found in the array.
2. **`Array.prototype.includes()`**
	* Pros: More concise and readable than `indexOf`.
	* Cons:
		+ Can be less efficient than `indexOf` for large arrays due to the implementation of `includes`.
		+ May not work as expected if `15000` is a string, as it will perform a Unicode search.
3. **`arr.findIndex(item => item.id === "15000")`**
	* Pros:
		+ More expressive and readable than `indexOf` or `includes`.
		+ Can be optimized by the V8 engine to use a linear search.
	* Cons:
		+ May not work as expected if `15000` is not found in the array (it will return `-1`, which can lead to errors).
		+ Requires more CPU cycles due to the iteration over the elements.

**Other Alternatives**

If you need to find an element in an array, consider using:

* **`Array.prototype.find()`**: Returns the first element that satisfies the provided condition. This method is generally faster and more efficient than `indexOf` or `includes`.
* **Custom implementation**: If you have control over the array's data structure, you can create a custom search algorithm for optimal performance.

Keep in mind that the best approach depends on your specific use case and requirements.

Latest run results:

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

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

Browser/OS: Chrome 100 on Windows

View result in a separate tab

Test name	Executions per second
includes	4714.8 Ops/sec
find	14250.5 Ops/sec
findIndex	10556.6 Ops/sec

Related benchmarks:

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

Comparing performance of: includes vs find vs findIndex

Created: 2 years ago by: Guest

Jump to the latest result

includes

find

findIndex

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