Benchmark: Array filter vs Set delete 2

Script Preparation code:

function arrayWithLength(length) {
    return Array(length).fill().map((_, i) => i);
}
var arr5 = arrayWithLength(5);
var arr10 = arrayWithLength(10);
var arr1000 = arrayWithLength(1000);
var arr1000000 = arrayWithLength(1000000);
var set5 = new Set(arr5);
var set10 = new Set(arr10);
var set1000 = new Set(arr1000);
var set1000000 = new Set(arr1000000);

Tests:

Filter arr10
arr10.filter(i => i === 5);
Filter set10
set10.delete(5);
Filter arr1000
arr1000.filter(i => i === 500);
Filter set1000
set1000.delete(500);
Filter arr1000000
arr1000000.filter(i => i === 500000);
Filter set1000000
set1000000.delete(500000);
Filter arr5
arr10.filter(i => i === 4);
Filter set5
set10.delete(4);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Filter arr10
Filter set10
Filter arr1000
Filter set1000
Filter arr1000000
Filter set1000000
Filter arr5
Filter set5

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

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

Browser/OS: Chrome 115 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Filter arr10	24040860.0 Ops/sec
Filter set10	29698058.0 Ops/sec
Filter arr1000	1167508.5 Ops/sec
Filter set1000	29604002.0 Ops/sec
Filter arr1000000	174.7 Ops/sec
Filter set1000000	31193286.0 Ops/sec
Filter arr5	24203146.0 Ops/sec
Filter set5	30085966.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Measuring the performance of JavaScript microbenchmarks can be a complex task, as it involves understanding various aspects of the language and its ecosystem.

**Benchmark Overview**

The provided benchmark measures the performance difference between using arrays with `filter()` or sets with `delete()` to remove elements. The test cases use different array sizes (5, 10, 1000, and 1,000,000) to evaluate the scalability of both approaches.

**Options Compared**

Two options are compared in this benchmark:

1. **Arrays with `filter()`:** This approach uses the `Array.prototype.filter()` method to create a new array with only the elements that pass the provided test function.
2. **Sets with `delete():`** This approach uses the `Set.prototype.delete()` method to remove an element from the set.

**Pros and Cons of Each Approach**

1. **Arrays with `filter()`:**
	* Pros:
		+ Can be used to create a new array with filtered elements.
		+ Allows for more control over the filtering process.
	* Cons:
		+ Creates a new array, which can lead to increased memory usage and slower performance.
		+ The test function is executed for each element in the array, leading to potentially higher overhead.
2. **Sets with `delete():`**
	* Pros:
		+ More efficient than arrays for large datasets, as sets only store unique values.
		+ Faster removal of elements, as sets use a hash table to store elements.
	* Cons:
		+ Limited control over the filtering process, as `delete()` removes all occurrences of the specified element.
		+ Not suitable for creating new arrays or performing complex filtering operations.

**Other Considerations**

1. **JavaScript Engines:** The benchmark results are likely influenced by the specific JavaScript engine being used (in this case, Chrome). Different engines may optimize `filter()` and `delete()` differently.
2. **Array and Set Initializers:** The use of `Array.prototype.fill()` and `Set` constructors in the script preparation code creates an initial array or set with a specific length. This can impact performance, as it may lead to slower initialization times for large arrays or sets.
3. **Test Case Variations:** The test cases vary the size of the array or set being filtered, which can affect performance. Larger datasets tend to exhibit different performance characteristics than smaller ones.

**Alternative Approaches**

Other approaches to filtering elements in JavaScript include:

1. **Using `reduce()` and `Array.prototype.indexOf():`** This approach uses a callback function with `reduce()` to iterate through the array and remove elements that don't match the test.
2. **Using `every()` and `Array.prototype.includes():`** This approach uses `every()` to create an iterator over the array, and then checks if each element matches the test using `includes()`.
3. **Using a simple loop with array indices:** This approach uses a manual loop to iterate through the array and remove elements that don't match the test.

Each of these alternatives has its own trade-offs in terms of performance, readability, and maintenance effort. The choice of approach depends on the specific requirements of the project and personal preference.

Related benchmarks:

Array filter vs Set delete 2 (version: 0)

Comparing performance of: Filter arr10 vs Filter set10 vs Filter arr1000 vs Filter set1000 vs Filter arr1000000 vs Filter set1000000 vs Filter arr5 vs Filter set5

Created: one year ago by: Registered User

Jump to the latest result

Filter arr10

Filter set10

Filter arr1000

Filter set1000

Filter arr1000000

Filter set1000000

Filter arr5

Filter set5

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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