Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Add item to array: push vs spread vs assign vs assign with from:
(version: 0)
Comparing performance of:
Push item to an array vs Append an item by spread vs Direct assign an item to an initialized array vs Direct assign an item usign Array.from
Created:
2 years ago
by:
Guest
Jump to the latest result
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; }
Direct assign an item usign Array.from
const items = Array.from(new Array(MAX_SIZE), (_, k) => k)
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (4)
Previous results
Fork
Test case name
Result
Push item to an array
Append an item by spread
Direct assign an item to an initialized array
Direct assign an item usign Array.from
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):
**Overview of the Benchmark** The provided benchmark, "Add item to array: push vs spread vs assign vs assign with from:", tests four different approaches for adding an item to an array: 1. `push()` 2. Spread operator (`...`) 3. Direct assignment using `Array.prototype.push()` (similar to `assign` in some other contexts) 4. Direct assignment using `Array.from()` constructor. **Approaches Compared** The benchmark compares the performance of these four approaches on a large array with 1000 elements, populated with sequential integers from 0 to 999. * **`push()`**: This method appends an item to the end of the array and returns the new length of the array. * **Spread operator (`...`)**: This method creates a new array by copying all elements from the original array and adding the new element. * **Direct assignment using `Array.prototype.push()`**: This method directly modifies the existing array by pushing the new element to it. * **Direct assignment using `Array.from()` constructor**: This method creates a new array with the specified length, populated with values generated by the provided callback function. **Pros and Cons of Each Approach** 1. **`push()`**: * Pros: Simple and widely supported; no need for explicit type conversions. * Cons: Can be slower than other approaches due to the overhead of creating a new array element. 2. **Spread operator (`...`)** * Pros: Efficient and concise way to create a new array with an additional element. * Cons: Creates a new array, which can lead to increased memory allocation and garbage collection. 3. **Direct assignment using `Array.prototype.push()`**: * Pros: Modifies the existing array, reducing memory allocations. * Cons: May not be as efficient as other approaches due to the overhead of calling `push()`. 4. **Direct assignment using `Array.from()` constructor**: * Pros: Creates a new array with a specified length and populates it efficiently. * Cons: Requires explicit type conversions and may be less concise than other approaches. **Library Used** None of the provided benchmark cases use any external libraries. **Special JS Feature/Syntax** The benchmark uses modern JavaScript features, including: 1. **Template literals**: Used in the `for` loop initialization string (`"const items = [];\r\nfor (let i = 0; i < MAX_SIZE; i++) {\r\n items.push(i); \r\n}"`). 2. **Arrow functions**: Used in some benchmark cases (`"items = [...items, i];"`). **Other Considerations** When choosing an approach for adding an item to an array, consider the trade-offs between: * Memory allocation and garbage collection overhead * Performance and efficiency * Code conciseness and readability In this specific benchmark, the spread operator appears to be the fastest approach, followed closely by direct assignment using `Array.from()`. The `push()` method is slower due to its overhead of creating a new array element.
Related benchmarks:
Add item to array: push vs spread vs assign:
spread vs push large
Add item to array: push vs spread vs assign vs assign+grow
Add item to array: push vs assign
Comments
Confirm delete:
Do you really want to delete benchmark?