Benchmark: findIndex vs IndexOf + map

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
arr.findIndex(x => x.id === 0);
Map + IndexOf
arr.map(x => x.id).indexOf(0);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
findIndex
Map + IndexOf

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/138.0.0.0 Mobile Safari/537.36

Browser/OS: Chrome Mobile 138 on Android

View result in a separate tab

Test name	Executions per second
findIndex	40489.1 Ops/sec
Map + IndexOf	3780.0 Ops/sec

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

LLMs can make mistakes. Check important info.

I'd be happy to help explain the provided benchmark.

**Benchmark Overview**

The benchmark is designed to compare the performance of two approaches: `findIndex` and `map` with `indexOf`. The goal is to find an element in an array that matches a specific condition.

**Script Preparation Code**

Before running each test case, the script prepares an array of 15,000 elements with a unique `id` property. The array is then modified by mapping over it and assigning the index to each element's `id` property using the arrow function `(el, idx) => el.id = idx`. This step is likely done to ensure that the search space for both test cases is uniform.

**Test Cases**

There are two individual test cases:

1. **findIndex**: This test case uses the `findIndex` method to find an element in the array where its `id` property equals 0.
2. **Map + IndexOf**: This test case first maps over the array using the same arrow function, and then uses the `indexOf` method to search for the value 0 within the mapped array.

**Libraries and Special JS Features**

Neither of these two approaches rely on any external libraries. However, it's worth noting that the arrow function syntax used in both test cases is a modern JavaScript feature introduced in ECMAScript 2015 (ES6).

**Options Compared**

The options being compared are:

1. **findIndex**: This method returns the index of the first element in the array that satisfies the provided condition. If no elements satisfy the condition, it returns -1.
2. **Map + IndexOf**: This approach maps over the array to create a new array with a different property, and then searches for the value 0 within this new array using the `indexOf` method.

**Pros and Cons of Each Approach**

1. **findIndex**:
	* Pros: Efficient in terms of memory usage, as it doesn't create a new array.
	* Cons: Can be slower than mapping over the entire array if the search space is large.
2. **Map + IndexOf**:
	* Pros: Allows for more flexibility in searching and can be faster if the search space is not exhaustive.
	* Cons: Requires creating an additional array, which can consume memory.

**Other Alternatives**

If you wanted to compare other approaches, here are some alternatives:

1. **Filter**: Instead of `findIndex`, you could use the `filter` method to create a new array with elements that satisfy the condition.
2. **For...of Loop**: You could use a traditional for loop or a for-of loop to iterate over the array and find the first matching element.

Keep in mind that these alternatives might have different performance characteristics, depending on your specific use case.

**Other Considerations**

* If you wanted to compare the performance of other JavaScript engines or platforms, MeasureThat.net allows you to do so. You can add more test cases with different browsers, platforms, or versions.
* Make sure to choose a suitable array size and element distribution that simulates real-world scenarios for your specific use case.

I hope this explanation helps!

Related benchmarks:

findIndex vs IndexOf + map (version: 0)

Comparing performance of: findIndex vs Map + IndexOf

Created: 2 years ago by: Guest

Jump to the latest result

findIndex

Map + IndexOf

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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