Benchmark: JS find vs indexOf

Script Preparation code:

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

Tests:

Array.find
const item = arr.find(item => item == 1E5);
Array.indexOf
const index = arr.indexOf(1E5);

Historical Performance Data aggregated from 219 community runs

Desktop Results:

Chrome 165 runs

Array.indexOf

113K/s

Array.find

2K/s

Fastest: Array.indexOf (56.0x faster)

View exact numbers

✓ Array.indexOf: 112,514 ops/sec
• Array.find: 2,009 ops/sec

Firefox 43 runs

Array.indexOf

13K/s

Array.find

3K/s

Fastest: Array.indexOf (4.7x faster)

View exact numbers

✓ Array.indexOf: 13,029 ops/sec
• Array.find: 2,785 ops/sec

Mobile Results:

Chrome 6 runs

Array.indexOf

70K/s

Array.find

1K/s

Fastest: Array.indexOf (54.4x faster)

View exact numbers

✓ Array.indexOf: 70,370 ops/sec
• Array.find: 1,293 ops/sec

Safari 5 runs

Array.indexOf

39K/s

Array.find

19K/s

Fastest: Array.indexOf (2.1x faster)

View exact numbers

✓ Array.indexOf: 38,985 ops/sec
• Array.find: 18,598 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.find
Array.indexOf

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 133 on Windows

View result in a separate tab

Array.indexOf

76K/s

Array.find

3K/s

View exact numbers

Test name	Executions per second
✓ Array.indexOf	76,400 Ops/sec
Array.find	2,995 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 benchmark definition and explain what's being tested, compared, and their pros and cons.

**Benchmark Definition**

The test is measuring the performance difference between two JavaScript methods:

1. `arr.find(item => item == 1E5)`: This method uses a callback function to find an element in the array that matches the condition.
2. `arr.indexOf(1E5)`: This method returns the index of the first occurrence of the specified value (in this case, `1E5`) in the array.

**Options Compared**

The benchmark is comparing two approaches:

* `Array.prototype.find()`
* `Array.prototype.indexOf()`

**Pros and Cons of Each Approach**

* **`arr.find()`**: This method uses a callback function to find an element that matches the condition. The pros are:
	+ More expressive and readable code, as it clearly conveys the intent of finding a specific value.
	+ Can be more efficient than `indexOf()` if the array is already sorted or has some other property that can aid in the search.
* However, the cons are:
	+ May be slower than `indexOf()`, especially for larger arrays, since it needs to iterate over each element and perform the callback function.
	+ Requires the use of a callback function, which can add complexity to the code.

* **`arr.indexOf()`**: This method returns the index of the first occurrence of the specified value in the array. The pros are:
	+ Typically faster than `find()`, since it only needs to scan through the array until it finds the match.
	+ Often used when you need to perform additional operations on the found element or its index.
* However, the cons are:
	+ Returns `-1` if the value is not found, which may require additional checks in the code.
	+ May return a non-zero index if there are duplicate values.

**Library and Its Purpose**

In this case, there is no explicitly mentioned library being used. The `Array.prototype.find()` and `Array.prototype.indexOf()` methods are built-in to the JavaScript language.

**Special JS Feature or Syntax**

There is a special syntax being used in the benchmark: `1E5`. This represents a scientific notation for the number 10000, which is equivalent to `10**4` in regular arithmetic. This syntax is commonly used in JavaScript to represent large numbers more concisely.

**Other Alternatives**

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

* For finding an element: You could use `Array.prototype.some()` or `Array.prototype.every()`, which return a boolean indicating whether at least one or all elements match the condition.
* For indexing an element: You could use `Array.prototype.at()`, which returns the value at the specified index (if it exists).

Keep in mind that these alternatives might have different performance characteristics and may not be as expressive or readable as the original `find()` and `indexOf()` methods.

I hope this explanation helps you understand the benchmark!

JS find vs indexOf (version: 0)

JS find vs indexOf

Comparing performance of: `Array.find vs Array.indexOf`

Created: 5 years ago by: Guest

Go to the latest result

Array.find

Array.indexOf

Historical Performance Data aggregated from 219 community runs

Desktop Results:

Chrome 165 runs

Firefox 43 runs

Mobile Results:

Chrome 6 runs

Safari 5 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

JS find vs indexOf (version: 0)

JS find vs indexOf

Comparing performance of: Array.find vs Array.indexOf

Created: 5 years ago by: Guest

Go to the latest result

Array.find

Array.indexOf

Historical Performance Data aggregated from 219 community runs

Desktop Results:

Chrome 165 runs

Firefox 43 runs

Mobile Results:

Chrome 6 runs

Safari 5 runs

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.find vs Array.indexOf`