Benchmark: find vs findIndex with value

Script Preparation code:

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

Tests:

Array.prototype.find
const item = arr.find(item => item == 1E5);
Array.prototype.findIndex
const index = arr.findIndex(item => item == 1E5); const item = arr[index]
Array.prototype.filter
const item = arr.filter(item => item == 1E5)[0];

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.prototype.find
Array.prototype.findIndex
Array.prototype.filter

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/122.0.0.0 Safari/537.36

Browser/OS: Chrome 122 on Mac OS X 10.15.7

View result in a separate tab

Array.prototype.findIndex

999/s

Array.prototype.find

979/s

Array.prototype.filter

916/s

View exact numbers

Test name	Executions per second
✓ Array.prototype.findIndex	999 Ops/sec
Array.prototype.find	979 Ops/sec
Array.prototype.filter	916 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down what is being tested in this benchmark and the options being compared.

**Benchmark Context**

The benchmark measures the performance of three JavaScript methods: `find`, `findIndex`, and `filter`. These methods are used to search for a specific value within an array. The benchmark creates a large array (`arr`) with values from 0 to 100,000 using a while loop.

**Method Options being Compared**

The benchmark compares the performance of these three methods:

1. **`find`**: Returns the first element in the array that satisfies the provided testing function.
2. **`findIndex`**: Returns the index of the first element in the array that satisfies the provided testing function.
3. **`filter`**: Creates a new array with all elements from the original array that satisfy the provided testing function.

**Pros and Cons of Each Approach**

1. **`find`**:
	* Pros: Can be more readable and concise, especially for simple filtering cases.
	* Cons: May return `undefined` if no element is found, which can lead to errors if not handled properly.
2. **`findIndex`**:
	* Pros: Returns an index, which can be useful for further processing or iterating over the array.
	* Cons: Requires additional code to access the value at that index.
3. **`filter`**:
	* Pros: Can be more efficient than `find` and `findIndex` if the filtering condition is expensive to compute, as it doesn't require a callback function like these two methods.
	* Cons: Creates a new array, which can lead to higher memory usage.

**Library Used**

None of the methods in this benchmark use any external libraries. However, some browsers may have built-in optimizations or features that affect the performance of these methods.

**Special JS Features or Syntax**

The benchmark doesn't mention any special JavaScript features or syntax, such as async/await, Promises, or generator functions.

**Other Considerations**

When choosing between `find`, `findIndex`, and `filter`, consider the following:

* Readability: If you need to perform complex filtering, `filter` may be more readable.
* Performance: If you're working with large datasets or expensive filtering conditions, `filter` might be more efficient.
* Handling edge cases: Make sure to handle scenarios where no elements are found by one of these methods.

**Alternatives**

If you don't need the exact functionality provided by `find`, `findIndex`, and `filter`, consider alternative approaches:

* Use a custom loop or iteration to search for an element in the array.
* Utilize other built-in JavaScript methods, such as `some()` or `every()`.
* Consider using external libraries like Lodash, which provides more comprehensive filtering and searching functionality.

find vs findIndex with value (version: 0) Benchmark.js

Comparing performance of: `Array.prototype.find vs Array.prototype.findIndex vs Array.prototype.filter`

Created: 2 years ago by: Guest

Go to the latest result

Array.prototype.find

Array.prototype.findIndex

Array.prototype.filter

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

find vs findIndex with value (version: 0) Benchmark.js

Comparing performance of: Array.prototype.find vs Array.prototype.findIndex vs Array.prototype.filter

Created: 2 years ago by: Guest

Go to the latest result

Array.prototype.find

Array.prototype.findIndex

Array.prototype.filter

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.prototype.find vs Array.prototype.findIndex vs Array.prototype.filter`