Benchmark: findIndex vs indexOf - JavaScript performance

Script Preparation code:

var arr = new Array(15000);
arr.fill({ id: 0 });
arr = arr.map((el, idx) => el.id = idx);
var foo = Math.floor(Math.random() * 15000);

Tests:

findIndex
var index = arr.findIndex((num) => num === foo);
indexOf
var index = arr.indexOf(foo);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
findIndex
indexOf

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 3 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
findIndex	42114.9 Ops/sec
indexOf	1206650.4 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the JavaScript microbenchmark on MeasureThat.net.

**Benchmark Overview**

The benchmark compares the performance of two methods: `Array.prototype.findIndex` and `Array.prototype.indexOf`. Both methods are used to find the index of a specific element in an array. The test creates a large array with 15,000 elements, each containing a unique identifier, and then randomly selects one element using the `Math.random()` function.

**Options Compared**

The two options being compared are:

1. `Array.prototype.findIndex`: This method returns the index of the first element in the array that satisfies the provided condition (in this case, the condition is `num === foo`). If no such element exists, it returns `-1`.
2. `Array.prototype.indexOf`: This method returns the index of the first occurrence of a specified value in the array.

**Pros and Cons**

* `Array.prototype.findIndex` has some advantages over `Array.prototype.indexOf`:
	+ It is more flexible, as it allows for a callback function to be provided, which can be useful for more complex search conditions.
	+ It returns `-1` if no element satisfies the condition, whereas `indexOf` throws an error or returns `-1`.
* However, `Array.prototype.indexOf` has some advantages over `findIndex`:
	+ It is generally faster and more efficient, especially for large arrays.
	+ It does not require a callback function, making it easier to use.

**Library and Purpose**

The benchmark uses the JavaScript standard library's built-in methods: `Array.prototype.findIndex` and `Array.prototype.indexOf`.

**Special JS Feature or Syntax**

There are no special JS features or syntax used in this benchmark.

**Other Considerations**

When choosing between `findIndex` and `indexOf`, consider the following:

* If you need to perform a complex search condition, use `findIndex`.
* If you're searching for a specific value that may not exist in the array, be prepared to handle the case where it doesn't exist (using `-1` or an error).
* If performance is critical and you're working with large arrays, consider using `indexOf`.

**Alternatives**

Other methods that could be used for finding the index of an element in an array include:

* Using a simple loop: `for (var i = 0; i < arr.length; i++) { if (arr[i] === foo) { break; } }`
* Using `Array.prototype.includes`: `return arr.indexOf(foo)` is equivalent to `arr.includes(foo)`
* Using a library like Lodash: `_findIndex(arr, foo)`

Keep in mind that these alternatives may have different performance characteristics and usage scenarios compared to `findIndex` and `indexOf`.

Related benchmarks:

findIndex vs indexOf - JavaScript performance (version: 0)

Comparing performance of: findIndex vs indexOf

Created: 4 years ago by: Guest

Jump to the latest result

findIndex

indexOf

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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