Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
findIndex vs map & indexOf vs find
(version: 0)
Comparing performance of:
findIndex vs map and indexOf vs find
Created:
5 years ago
by:
Guest
Go to the latest result
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.indexOf(foo);
map and indexOf
var index = arr.map(o => o.id).indexOf(foo);
find
var found = arr.find(e => e.id === foo)
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
findIndex
map and indexOf
find
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
8 months ago
)
User agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36
Browser/OS:
Chrome 143 on Windows
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=622264" width="100%" height="500px"></iframe>
findIndex
3.8M/s
find
42K/s
map and indexOf
13K/s
View exact numbers
Test name
Executions per second
✓
findIndex
3,810,162 Ops/sec
find
41,931 Ops/sec
map and indexOf
13,062 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's dive into the world of JavaScript microbenchmarks! **Benchmark Overview** The provided benchmark tests three different approaches to find an element in an array: `findIndex`, `map` followed by `indexOf`, and `find`. The benchmark creates an array of 15,000 elements with a unique `id` property, fills it with random values, and then uses the test cases to search for a specific value. **Options Compared** 1. **findIndex**: This method returns the index of the first element that satisfies the provided condition. 2. **map & indexOf**: This approach creates a new array with the desired properties using `map`, and then searches for the target value in this new array using `indexOf`. 3. **find**: This method returns the first element that satisfies the provided condition. **Pros and Cons** 1. **findIndex**: * Pros: Efficient, simple, and concise. * Cons: May not be as intuitive for developers who are not familiar with it. 2. **map & indexOf**: * Pros: Allows for more control over the data transformation and searching process. * Cons: Creates a new array, which can lead to performance issues if the original array is large. 3. **find**: * Pros: More intuitive than `findIndex`, but may not be as efficient for large arrays. * Cons: May return `undefined` if no matching element is found. **Library/Functionality Used** None of the test cases use any external libraries or functions beyond the built-in JavaScript methods. However, it's worth noting that the `map` method uses a callback function to transform the elements in the array. **Special JS Feature/Syntax** None of the test cases employ any special JavaScript features or syntax beyond what is considered standard practice. **Other Alternatives** If you were to write this benchmark yourself, here are some alternative approaches you could consider: * **filter**: Instead of `findIndex`, you could use the `filter` method to find the first element that satisfies the condition. * **forEach**: You could also use a loop and the `forEach` method to iterate over the array and search for the target value. **Benchmark Preparation Code Explanation** The script preparation code creates an array of 15,000 elements with unique `id` properties. The line `arr.fill({ id: 0 });` initializes each element's `id` property to 0. Then, it uses the `map` method to transform these elements into objects with only the `id` property set to their original index. The HTML preparation code is empty in this case, suggesting that the benchmark focuses solely on JavaScript performance and does not require any UI-related overhead. **Latest Benchmark Result Explanation** The results show the execution frequency per second for each test case on a Chrome 89 browser running on a Linux desktop. The values indicate how many times each test case was executed within a second.
Related benchmarks
findIndex vs map & indexOf
findIndex vs indexOf - JavaScript performance
Array.prototype.findIndex vs Array.prototype.map + Array.prototype.indexOf
findIndex vs IndexOf + map
Comments
Confirm delete:
Do you really want to delete benchmark?