Benchmark: Filter vs indexOf Speed

Script Preparation code:


var testArray = [];
for (var i = 0; i < 10000; i++) {
  testArray.push(Math.floor(i * 1000) + 1)
}

Tests:

remove finding element using indexof
function removeElement(testArray, element) { return ( index = testArray.indexOf(element) !==-1) ? testArray.splice(index, 1):0; } removeElement(testArray, 2000001);
remove finding element using filter
function removeElement(testArray, element) { return testArray.filter(s => s !== element); } removeElement(testArray, 2000001);

Historical Performance Data aggregated from 30 community runs

Desktop Results:

Chrome 25 runs

remove finding element using indexof

1.1M/s

remove finding element using filter

25K/s

Fastest: remove finding element using indexof (42.2x faster)

View exact numbers

✓ remove finding element using indexof: 1,060,255 ops/sec
• remove finding element using filter: 25,138 ops/sec

Firefox 5 runs

remove finding element using indexof

208K/s

remove finding element using filter

23K/s

Fastest: remove finding element using indexof (9.1x faster)

View exact numbers

✓ remove finding element using indexof: 207,733 ops/sec
• remove finding element using filter: 22,810 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
remove finding element using indexof
remove finding element using filter

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 141 on Windows

View result in a separate tab

remove finding element using indexof

1.2M/s

remove finding element using filter

25K/s

View exact numbers

Test name	Executions per second
✓ remove finding element using indexof	1,205,084 Ops/sec
remove finding element using filter	24,715 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 benchmark and explain what's being tested.

**What is being tested?**

The benchmark measures the performance of two different approaches to remove an element from an array in JavaScript:

1. **indexOf method**: This approach uses the `indexOf` method to find the index of the specified element in the array, and then splices the element at that index to remove it.
2. **Filter method**: This approach uses the `filter` method to create a new array with all elements that do not match the specified element.

**Options being compared**

The two options are:

* `indexOf` method
* `filter` method

**Pros and Cons of each approach:**

1. `indexOf` method:
	* Pros:
		+ Efficient use of memory, as it only creates a new array with the desired elements.
		+ Fast lookup time, as it uses a binary search algorithm under the hood.
	* Cons:
		+ May not be suitable for very large datasets, as it can lead to slow performance due to the increased memory usage.
2. `filter` method:
	* Pros:
		+ More concise and readable code, as it eliminates the need for indexing and splicing.
		+ Can handle large datasets more efficiently, as it only iterates over the elements once.
	* Cons:
		+ May have higher memory overhead due to the creation of a new array.
		+ Can be slower than `indexOf` method for very small arrays or specific use cases.

**Library and purpose**

In this benchmark, no external library is used. The `filter` method is a native JavaScript method that is built into the language.

**Special JS feature or syntax**

The benchmark does not rely on any special JavaScript features or syntax. It only uses standard JavaScript concepts and methods.

**Other alternatives**

If you were to rewrite this benchmark using different approaches, some alternatives could be:

* Using `map` method instead of `filter`: This would create a new array with the desired elements, but it might have slightly higher memory overhead.
* Using `reduce` method instead of `indexOf` and splicing: This would create a new array with the reduced elements, but it might have slightly slower performance due to the additional iteration.

Overall, the choice between `indexOf` and `filter` depends on the specific use case and performance requirements. If memory efficiency is crucial and you're working with small datasets, the `indexOf` method might be a better choice. However, if readability and conciseness are more important, or you need to handle large datasets efficiently, the `filter` method could be a better option.

Filter vs indexOf Speed (version: 0)

Filter vs indexOf in array remove element Javascript

Comparing performance of: `remove finding element using indexof vs remove finding element using filter`

Created: 5 years ago by: Guest

Go to the latest result

remove finding element using indexof

remove finding element using filter

Historical Performance Data aggregated from 30 community runs

Desktop Results:

Chrome 25 runs

Firefox 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):

Filter vs indexOf Speed (version: 0)

Filter vs indexOf in array remove element Javascript

Comparing performance of: remove finding element using indexof vs remove finding element using filter

Created: 5 years ago by: Guest

Go to the latest result

remove finding element using indexof

remove finding element using filter

Historical Performance Data aggregated from 30 community runs

Desktop Results:

Chrome 25 runs

Firefox 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: `remove finding element using indexof vs remove finding element using filter`