Benchmark: spread or push long array

Tests:

spread
const nodes = [ {id: 1, graphKey: 'key1'}, {id: 9, graphKey: 'key9'}, {id: 3, graphKey: 'key3'}, {id: 4, graphKey: 'key4'}, {id: 5, graphKey: 'key5'}, {id: 6, graphKey: 'key5'}, {id: 7, graphKey: 'key5'}, {id: 8, graphKey: 'key5'}, {id: 10, graphKey: 'key5'}, {id: 11, graphKey: 'key5'}, {id: 12, graphKey: 'key5'}, {id: 13, graphKey: 'key5'}, {id: 14, graphKey: 'key5'}, {id: 15, graphKey: 'key5'}, {id: 16, graphKey: 'key5'}, {id: 17, graphKey: 'key5'}, ] const selected = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21] const selectedNodeIds = selected.reduce((result, currentSelected) => { const node = nodes.find((n) => n.id === currentSelected); return node ? [...result, node.graphKey] : result; }, []) console.log(selectedNodeIds);
push
const nodes = [ {id: 1, graphKey: 'key1'}, {id: 9, graphKey: 'key9'}, {id: 3, graphKey: 'key3'}, {id: 4, graphKey: 'key4'}, {id: 5, graphKey: 'key5'}, {id: 6, graphKey: 'key5'}, {id: 7, graphKey: 'key5'}, {id: 8, graphKey: 'key5'}, {id: 10, graphKey: 'key5'}, {id: 11, graphKey: 'key5'}, {id: 12, graphKey: 'key5'}, {id: 13, graphKey: 'key5'}, {id: 14, graphKey: 'key5'}, {id: 15, graphKey: 'key5'}, {id: 16, graphKey: 'key5'}, {id: 17, graphKey: 'key5'}, ] const selected = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21] const selectedNodeIds = selected.reduce((result, currentSelected) => { const node = nodes.find((n) => n.id === currentSelected); if (node) { result.push(node.graphKey) } return result; }, []) console.log(selectedNodeIds);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
spread
push

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's break down the benchmark and its test cases.

**Benchmark Overview**

MeasureThat.net is a website that allows users to create and run JavaScript microbenchmarks. The provided JSON represents two test cases, "spread" and "push", which compare the performance of two different approaches for selecting node IDs from an array.

**Test Cases**

The two test cases are:

1. **Spread**: This test case creates an array `nodes` with 21 objects, each containing an `id` and a `graphKey`. Then, it defines an array `selected` with 21 elements, which will be used to select the corresponding node IDs from the `nodes` array using the `reduce()` method.
2. **Push**: This test case is similar to the "spread" test case, but instead of using the `reduce()` method, it uses a simple loop to iterate over the `selected` array and push the selected node IDs into an array.

**Options Compared**

The two test cases compare the performance of:

* Using the `reduce()` method with the spread operator (`[...]`) to create a new array from the results.
* Using a traditional `for` loop or a more modern `forEach()` loop to iterate over the `selected` array and push the selected node IDs into an array.

**Pros and Cons**

**Spread (Reduce)**

Pros:

* More concise and expressive code
* Can be more efficient for large arrays, as it avoids explicit indexing and looping

Cons:

* May have performance overhead due to the creation of a new array
* Requires modern JavaScript features (ES6+)

**Push (Traditional Loop)**

Pros:

* Typically faster and more efficient than using `reduce()`
* Does not require modern JavaScript features

Cons:

* More verbose and less concise code
* Can be slower for large arrays due to explicit looping and indexing.

**Other Considerations**

* Both test cases use the same input array (`nodes`) and selection logic (`selected`), so any differences in performance are likely due to the different methods used.
* The `reduce()` method is a more functional programming-style approach, while the traditional loop is an imperative programming-style approach. This may affect the perceived performance or efficiency of each method.

**Libraries Used**

There is no explicit library mentioned in the provided JSON. However, it's worth noting that some modern JavaScript frameworks and libraries (e.g., React, Angular) use functional programming concepts like `reduce()` to manipulate data.

**Special JS Features/ Syntax**

None are explicitly used in these test cases. If you're interested in exploring other special features or syntax, I'd be happy to help!

**Alternatives**

If you want to explore alternative approaches for selecting node IDs from an array, here are a few options:

* Using `filter()` and `map()` methods instead of `reduce()`
* Using a library like Lodash, which provides a `some()` function that can be used to select elements from an array
* Implementing a custom iteration loop using `for...of` or `for...in` loops

Keep in mind that these alternatives may affect the performance or efficiency of your code.

Latest run results:

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

User agent: Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/125.0.0.0 Mobile Safari/537.36

Browser/OS: Chrome Mobile 125 on Android

View result in a separate tab

Test name	Executions per second
spread	32807.2 Ops/sec
push	39595.8 Ops/sec

Related benchmarks:

spread or push long array (version: 0)

Comparing performance of: spread vs push

Created: 5 months ago by: Registered User

Jump to the latest result

spread

push

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