Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
spread or push long array
(version: 0)
Comparing performance of:
spread vs push
Created:
one year ago
by:
Registered User
Jump to the latest result
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>
Run tests (2)
Previous results
Fork
Test case name
Result
spread
push
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
one year 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
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=528456" width="100%" height="500px"></iframe>
Test name
Executions per second
spread
32807.2 Ops/sec
push
39595.8 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
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.
Related benchmarks:
Pushing items via Array.push vs. Spread Operator
Large arrays spread vs push
Array.push vs Spread operator
Push vs LHS spread
Javascript: Spread vs push
Comments
Confirm delete:
Do you really want to delete benchmark?