Benchmark: Find index of select option

HTML Preparation code:

<select>
    <option value="Strawberry">Strawberry</option>
    <option value="Blueberry">Blueberry</option>
    <option value="Peach">Peach</option>
    <option value="Pomegranate">Pomegranate</option>
    <option value="Grape">Grape</option>
    <option value="Banana">Banana</option>
    <option value="Cherry">Cherry</option>
    <option value="Pineapple">Pineapple</option>
    <option value="Pear">Pear</option>
    <option value="Plum">Plum</option>
    <option value="Muskmelon">Muskmelon</option>
    <option value="Avocado">Avocado</option>
    <option value="Apricot">Apricot</option>
    <option value="Mango">Mango</option>
    <option value="Apple">Apple</option>
    <option value="Papaya">Papaya</option>
    <option value="Lemon">Lemon</option>
    <option value="Coconut">Coconut</option>
    <option value="Jackfruit">Jackfruit</option>
    <option value="Nectarine">Nectarine</option>
  	<option value="Strawberry">Strawberry</option>
    <option value="Blueberry">Blueberry</option>
    <option value="Peach">Peach</option>
    <option value="Pomegranate">Pomegranate</option>
    <option value="Grape">Grape</option>
    <option value="Green Banana">Green Banana</option>
    <option value="Cherry">Cherry</option>
    <option value="Pineapple">Pineapple</option>
    <option value="Pear">Pear</option>
    <option value="Plum">Plum</option>
    <option value="Muskmelon">Muskmelon</option>
    <option value="Avocado">Avocado</option>
    <option value="Apricot">Apricot</option>
    <option value="Mango">Mango</option>
    <option value="Apple">Apple</option>
    <option value="Papaya">Papaya</option>
    <option value="Lemon">Lemon</option>
    <option value="Coconut">Coconut</option>
    <option value="Jackfruit">Jackfruit</option>
    <option value="Nectarine">Nectarine</option>
</select>

Tests:

For..Loop
const selectElement = document.querySelector('select'); let selectedIndex = -1; for (let i = 0; i < selectElement.options.length; i++) { if (selectElement.options[i].value === 'Green Banana') { selectedIndex = i; break; } }
FindIndex
const selectElement = document.querySelector('select'); const selectedIndex = [...selectElement.options].findIndex(o => o.value === 'Green Banana');

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
For..Loop
FindIndex

Fastest: N/A

Slowest: N/A

ⓘ Get performance results from real users on your website with Request Metrics.

Website Performance Monitoring by Request Metrics

Latest run results:

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

User agent: Mozilla/5.0 (iPhone; CPU iPhone OS 14_0_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0 Mobile/15E148 Safari/604.1

Browser/OS: Mobile Safari 14 on iOS 14.0.1

View result in a separate tab

Test name	Executions per second
For..Loop	602641.7 Ops/sec
FindIndex	582203.4 Ops/sec

Find index of select option (version: 0)

Find one option's index in select element

Comparing performance of: For..Loop vs FindIndex

Created: 3 years ago by: Guest

Jump to the latest result

For..Loop

FindIndex

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A