Benchmark: Filtering + Mapping

Script Preparation code:

var arr = new Array(100).fill(null).map((val, index) => index);

function filterMap(
  iterable,
  filterFn,
  mapFn,
) {
  const result = [];
  for (const value of iterable) {
    if (filterFn(value)) {
      result.push(mapFn(value));
    }
  }
  return result;
}

Tests:

Using filterMap()
const a = filterMap(arr, (val) => val % 2 === 0, (val) => val + 10);
.filter.map
const a = arr .filter((val) => val % 2 === 0) .map((val) => val + 10);
Flatmap
const a = arr.flatMap((val) => val % 2 === 0 ? [val + 10] : [])

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Using filterMap()
.filter.map
Flatmap

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/116.0.0.0 Safari/537.36

Browser/OS: Chrome 116 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Using filterMap()	4097254.0 Ops/sec
.filter.map	2691820.5 Ops/sec
Flatmap	176721.1 Ops/sec

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

LLMs can make mistakes. Check important info.

**What is being tested?**

The provided JSON benchmark definition represents three different test cases for filtering and mapping arrays in JavaScript. The test cases are designed to measure the performance of two approaches: `filterMap()`, `.filter.map`, and `flatMap()`.

**Options compared:**

1. **`filterMap()`**: A custom function created by the user that filters an array using a provided filter function and maps each filtered element to another value using a separate mapping function.
2. **`.filter.map()`**: A chained method call that first filters the array using `.filter()`, then maps each filtered element to a new value using `.map()`.
3. **`flatMap()`**: A custom implementation of the `flatMap()` method, which is not part of the standard JavaScript array prototype.

**Pros and Cons:**

1. **`filterMap()`**:
	* Pros: Can be customized to fit specific use cases, can handle more complex filtering logic.
	* Cons: May have a higher overhead due to the additional function call, and may require more memory allocation for the intermediate results.
2. **`.filter.map()`**:
	* Pros: Familiar syntax for developers who are already familiar with chained method calls, relatively low overhead.
	* Cons: Can be less readable due to the chaining of methods, may not be suitable for complex filtering logic.
3. **`flatMap()`**:
	* Pros: Can be more memory-efficient than `filterMap()`, as it doesn't create an intermediate array.
	* Cons: May require manual iteration or additional libraries, can be less readable.

**Library usage:**

None of the test cases use any external libraries, except for the standard JavaScript array prototype methods (`filter()`, `map()`, and `flatMap()`).

**Special JS feature or syntax:**

There are no special features or syntax used in these test cases. They focus on demonstrating different approaches to filtering and mapping arrays.

**Other alternatives:**

1. **`reduce()`**: Another method that can be used for filtering and mapping arrays, although it may require more complex logic to achieve the same results.
2. **Lambda functions**: Can be used as alternatives to callback functions in `filterMap()`, but may not provide the same level of customization.
3. **Higher-order functions**: Libraries like Lodash or Ramda can provide additional filtering and mapping capabilities, although they may add overhead.

Keep in mind that the choice of approach ultimately depends on the specific use case and personal preference. These test cases aim to demonstrate different strategies for filtering and mapping arrays, allowing users to compare their performance and choose the best approach for their needs.

Related benchmarks:

Filtering + Mapping (version: 0)

Comparing performance of: Using filterMap() vs .filter.map vs Flatmap

Created: one year ago by: Guest

Jump to the latest result

Using filterMap()

.filter.map

Flatmap

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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