Benchmark: for in vs reduce vs pick vs objectsdf

HTML Preparation code:


<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>

Tests:

hasownprop
const TEXT_PROPS_TO_BLOCK = { 'display':true, 'textColor':true, 'verticalAlign':true, 'className':true, 'style':true }; const propsToTest = { "aria-label": "ordered list", "data-test": "something", "textColor": "foo", "className": "bar" } const newList = Object.keys(propsToTest).reduce((newObj, key) => { if (!TEXT_PROPS_TO_BLOCK.hasOwnProperty(key)) { newObj[key] = propsToTest[key]; } return newObj; }, {});
reduce includes
const TEXT_PROPS_TO_BLOCK = [ 'display', 'textColor', 'verticalAlign', 'className', 'style', ]; const propsToTest = { "aria-label": "ordered list", "data-test": "something", "textColor": "foo", "className": "bar" } const newList = Object.keys(propsToTest).reduce((newObj, key) => { if (!TEXT_PROPS_TO_BLOCK.includes(key)) { newObj[key] = propsToTest[key]; } return newObj; }, {});

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
hasownprop
reduce includes

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what's being tested, compared, and considered.

**Benchmark Overview**

The provided benchmark compares four different approaches to filter properties from an object:

1. `for` loop
2. `reduce()`
3. `includes()` with array filtering (using `Object.keys()` and `reduce()`)
4. Object iteration using a `for...in` loop

These methods are used to extract specific properties from an object, specifically the ones that exist in a predefined array (`TEXT_PROPS_TO_BLOCK`). The benchmark aims to determine which approach is faster and more efficient.

**Library**

The benchmark uses Lodash.js library, which provides functional programming utilities. In this case, `reduce()` is used as a utility function to filter properties from an object.

**Special JS Features/Syntax**

None mentioned in the provided code snippets.

**Benchmark Preparation Code**

The preparation code includes a script tag that loads the Lodash.min.js file from a CDN, making it available for use in the benchmark.

**Individual Test Cases**

Each test case involves creating an object `propsToTest` with some properties and then using one of the four approaches to filter out properties that do not exist in the predefined array (`TEXT_PROPS_TO_BLOCK`). The resulting filtered objects are stored in variables like `newObj` or `newList`.

**Comparison Options**

The benchmark compares the execution time of each approach:

1. **For Loop**: Iterates over the object's properties using a `for...in` loop.
2. **Reduce()**: Uses the `reduce()` function to filter properties from an object.
3. **Includes() with Array Filtering**: Uses `Object.keys()` to get an array of property names, then uses `includes()` to filter out properties that do not exist in the predefined array.

**Pros and Cons**

Here's a brief summary:

1. **For Loop**:
	* Pros: Simple and straightforward.
	* Cons: Can be slow for large objects due to property iteration.
2. **Reduce()**:
	* Pros: Fast and efficient for filtering large objects.
	* Cons: May require additional setup (e.g., understanding the callback function).
3. **Includes() with Array Filtering**:
	* Pros: Similar to `reduce()`, but uses a more straightforward approach.
	* Cons: Requires creating an array of property names, which can be slower for large objects.

**Other Alternatives**

If you need alternative approaches, consider:

1. Using `Object.fromEntries()` and filtering the resulting object with `Object.fromEntries()` or `filter()`.
2. Utilizing a library like Ramda.js, which provides functional programming utilities similar to Lodash.
3. Implementing your own custom filter function using arrow functions.

Keep in mind that the performance differences between these approaches may vary depending on the specific use case and object size.

When running this benchmark, consider the following factors:

* Object size: Larger objects may favor `reduce()` or `includes()` with array filtering over traditional `for` loops.
* Performance requirements: If you need to filter large objects frequently, optimize for speed using approaches like `reduce()` or `includes()`.
* Readability and maintainability: Choose an approach that balances performance with code readability.

Related benchmarks:

for in vs reduce vs pick vs objectsdf (version: 0)

Comparing performance of: hasownprop vs reduce includes

Created: 6 years ago by: Guest

Jump to the latest result

hasownprop

reduce includes

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

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