Benchmark: push vs spread - MeasureThat.net

Tests:

push1
const input = [ { type: 'a', distance: 5 }, { type: 'c', distance: 3 }, { type: 'b', distance: 6 }, { type: 'c', distance: 12 }, { type: 'b', distance: 1 }, { type: 'a', distance: 5 }, { type: 'b', distance: 6 }, { type: 'a', distance: -1 }, { type: 'c', distance: 9 }, { type: 'd', distance: 10 } ] const normalize = (arr) => arr .filter(el => el.type !== 'a' && el.distance >= 0) .reduce((acc, el) => { if (el.distance < 4) acc.near.push(el); else if (el.distance < 8) acc.medium.push(el); else if (el.distance <= 10) acc.far.push(el); return acc; }, { near:[], medium:[], far:[] })
Spread
const input = [ { type: 'a', distance: 5 }, { type: 'c', distance: 3 }, { type: 'b', distance: 6 }, { type: 'c', distance: 12 }, { type: 'b', distance: 1 }, { type: 'a', distance: 5 }, { type: 'b', distance: 6 }, { type: 'a', distance: -1 }, { type: 'c', distance: 9 }, { type: 'd', distance: 10 } ] function normalizeInput(input) { return input.reduce((accum, item) => { if (item.type !== 'a' && item.distance >= 0) if (item.distance < 4 ) accum.near = [...accum.near, item] else if (item.distance < 8 ) accum.medium = [...accum.medium, item] else if (item.distance <= 10 ) accum.far = [...accum.far, item] return accum; },{ near:[], medium:[], far:[] }) }
push2
const input = [ { type: 'a', distance: 5 }, { type: 'c', distance: 3 }, { type: 'b', distance: 6 }, { type: 'c', distance: 12 }, { type: 'b', distance: 1 }, { type: 'a', distance: 5 }, { type: 'b', distance: 6 }, { type: 'a', distance: -1 }, { type: 'c', distance: 9 }, { type: 'd', distance: 10 } ] const norm = (input) => input.reduce((acc, item) => { if (item.type !== 'a' && item.distance >= 0) if (item.distance < 4) acc.near.push(item); else if (item.distance < 8) acc.medium.push(item); else if (item.distance <= 10) acc.far.push(item); return acc; },{ near:[], medium:[], far:[] })

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
push1
Spread
push2

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

I'll dive right in!

**Benchmark Purpose**

The benchmark, "push vs spread", is designed to compare the performance of three approaches:

1. `push`: Using the traditional `concat()` method with `push()` to add elements to an array.
2. `Spread` (new ES6 operator): Using the spread operator (`...`) to add elements to an array.
3. `push2` ( modified Spread ): A variation of the Spread approach, where the spread operator is used in conjunction with a custom function.

**Options Compared**

The benchmark compares the performance of these three approaches:

* **Push**: The traditional way of adding elements to an array using `concat()` and `push()`.
* **Spread**: The new ES6 spread operator (`...`) for adding elements to an array.
* `push2`: A modified version of the Spread approach, where a custom function is used in conjunction with the spread operator.

**Pros and Cons**

Here's a brief summary:

* **Push**:
	+ Pros: Simple and widely supported.
	+ Cons: Can be slow due to the creation of new arrays.
* **Spread**:
	+ Pros: More concise and potentially faster than traditional `concat()` and `push()`.
	+ Cons: May not work as expected in older browsers or environments that don't support the spread operator.
* `push2`:
	+ Pros: Offers a balance between conciseness and performance, using a custom function to handle array manipulation.
	+ Cons: May have additional overhead due to the custom function.

**Library Used**

None. The benchmark uses native JavaScript features only.

**Special JS Features or Syntax**

The spread operator (`...`) is a new feature introduced in ES6. It allows for more concise array creation and manipulation. In this benchmark, it's used to add elements to an array without creating a new array using `concat()`.

**Other Alternatives**

If you're looking for alternative approaches, you could consider:

* Using other array methods like `slice()`, `splice()`, or `forEach()` instead of `push()`.
* Utilizing libraries like Lodash or Underscore.js, which provide additional utility functions for array manipulation.
* Implementing a custom array management system using a data structure like a linked list or a binary search tree.

Keep in mind that these alternatives might offer different trade-offs in terms of performance, conciseness, and maintainability.

Latest run results:

Run details: (Test run date: 6 years ago)

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

Browser/OS: Chrome 69 on Mac OS X 10.13.6

View result in a separate tab

Test name	Executions per second
push1	736101824.0 Ops/sec
Spread	739526272.0 Ops/sec
push2	738272768.0 Ops/sec

Related benchmarks:

push vs spread (version: 0)

Compare the new ES6 spread operator with the traditional concat() method and push

Comparing performance of: push1 vs Spread vs push2

Created: 6 years ago by: Guest

Jump to the latest result

push1

Spread

push2

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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