Benchmark: Add item to array: push vs spread vs assign:

Script Preparation code:

window.MAX_SIZE = 1000;

Tests:

Push item to an array
const items = []; for (let i = 0; i < MAX_SIZE; i++) { items.push(i); }
Append an item by spread
let items = []; for (let i = 0; i < MAX_SIZE; i++) { items = [...items, i]; }
Direct assign an item to an initialized array
const items = new Array(MAX_SIZE); for (let i = 0; i < MAX_SIZE; i++) { items[i] = i; }

Historical Performance Data aggregated from 82 community runs

Desktop Results:

Chrome 59 runs

Push item to an array

14K/s

Direct assign an item to an initialized array

14K/s

Append an item by spread

1K/s

Fastest: Push item to an array (9.9x faster)

View exact numbers

✓ Push item to an array: 14,020 ops/sec
• Direct assign an item to an initialized array: 13,949 ops/sec
• Append an item by spread: 1,423 ops/sec

Safari 10 runs

Direct assign an item to an initialized array

22K/s

Push item to an array

21K/s

Append an item by spread

744/s

Fastest: Direct assign an item to an initialized array (29.2x faster)

View exact numbers

✓ Direct assign an item to an initialized array: 21,701 ops/sec
• Push item to an array: 20,978 ops/sec
• Append an item by spread: 744 ops/sec

Firefox 8 runs

Push item to an array

593K/s

Direct assign an item to an initialized array

553K/s

Append an item by spread

472/s

Fastest: Push item to an array (1256.3x faster)

View exact numbers

✓ Push item to an array: 592,950 ops/sec
• Direct assign an item to an initialized array: 552,680 ops/sec
• Append an item by spread: 472 ops/sec

Mobile Results:

Chrome 5 runs

Direct assign an item to an initialized array

8K/s

Push item to an array

8K/s

Append an item by spread

706/s

Fastest: Direct assign an item to an initialized array (11.6x faster)

View exact numbers

✓ Direct assign an item to an initialized array: 8,180 ops/sec
• Push item to an array: 8,004 ops/sec
• Append an item by spread: 706 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Push item to an array
Append an item by spread
Direct assign an item to an initialized array

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one month ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/149.0.0.0 Safari/537.36

Browser/OS: Chrome 149 on Windows

View result in a separate tab

Direct assign an item to an initialized array

511K/s

Push item to an array

229K/s

Append an item by spread

1K/s

View exact numbers

Test name	Executions per second
✓ Direct assign an item to an initialized array	510,815 Ops/sec
Push item to an array	228,925 Ops/sec
Append an item by spread	1,422 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down what is being tested in the provided JSON.

**Benchmark Definition**

The benchmark tests three different approaches to add an item to an array:

1. **Push**: Using the `push()` method to add an item to the end of an array.
2. **Spread**: Using the spread operator (`...`) to create a new array with the original array and the new item.
3. **Direct Assign**: Directly assigning the new item to an existing array using the assignment syntax.

**Options Compared**

The benchmark compares the performance of these three approaches:

* **Pros of each approach:**
	+ Push: Simple, efficient, and widely supported by JavaScript engines.
	+ Spread: Creates a new array, which can be beneficial for certain use cases (e.g., when working with large datasets).
	+ Direct Assign: Directly modifies the existing array, which can be faster but may have unexpected side effects if not used carefully.
* **Cons of each approach:**
	+ Push: May require more memory allocation and garbage collection compared to spread or direct assign.
	+ Spread: Creates a new array, which can lead to increased memory usage and potential performance overhead for large datasets.
	+ Direct Assign: Can be faster but may have unexpected side effects if not used carefully (e.g., modifying the original array).

**Library Usage**

None of the benchmark cases use any external libraries.

**Special JS Features/Syntax**

The benchmark does not mention any special JavaScript features or syntax. The code only uses standard JavaScript syntax and built-in methods.

**Alternative Approaches**

Other approaches to add an item to an array include:

* Using `concat()`: Instead of push, you can use the `concat()` method to create a new array with the original array and the new item.
* Using `Array.prototype.push.apply()`: This method applies the `push()` method to the array, which can be more efficient for large arrays.

It's worth noting that these alternative approaches may have different performance characteristics compared to push, spread, or direct assign.

Add item to array: push vs spread vs assign: (version: 1)

Comparing performance of: `Push item to an array vs Append an item by spread vs Direct assign an item to an initialized array`

Created: 6 years ago by: Registered User

Go to the latest result

Push item to an array

Append an item by spread

Direct assign an item to an initialized array

Historical Performance Data aggregated from 82 community runs

Desktop Results:

Chrome 59 runs

Safari 10 runs

Firefox 8 runs

Mobile Results:

Chrome 5 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Add item to array: push vs spread vs assign: (version: 1)

Comparing performance of: Push item to an array vs Append an item by spread vs Direct assign an item to an initialized array

Created: 6 years ago by: Registered User

Go to the latest result

Push item to an array

Append an item by spread

Direct assign an item to an initialized array

Historical Performance Data aggregated from 82 community runs

Desktop Results:

Chrome 59 runs

Safari 10 runs

Firefox 8 runs

Mobile Results:

Chrome 5 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

Comparing performance of: `Push item to an array vs Append an item by spread vs Direct assign an item to an initialized array`