Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Large array concat vs spread vs push spread, loop, apply
(version: 0)
Compare the new ES6 spread operator with the traditional concat() method and push
Comparing performance of:
Array.prototype.concat vs spread operator vs Push Spread vs Push Apply vs Push Loop
Created:
4 years ago
by:
Guest
Jump to the latest result
Script Preparation code:
var subarrs = []; for(let i = 0; i < 100; i++){ subarrs.push((new Array(500)).fill(i)) }
Tests:
Array.prototype.concat
var other = [ 1, 2, 3 ] for (var len = subarrs.length, i = 0; i < len; i++){ other = other.concat(subarrs[i]); } return other;
spread operator
var other = [ 1, 2, 3 ] for (var len = subarrs.length, i = 0; i < len; i++){ other = [ ...other, ...subarrs[i] ] } return other;
Push Spread
var other = [ 1, 2, 3 ] for (var len = subarrs.length, i = 0; i < len; i++){ other.push(...subarrs[i]); } return other;
Push Apply
var other = [ 1, 2, 3 ] for (var len = subarrs.length, i = 0; i < len; i++){ other.push.apply(other, subarrs[i]); } return other;
Push Loop
var other = [ 1, 2, 3 ] for (var len = subarrs.length, i = 0; i < len; i++){ for (var jarr = subarrs[i], jen = jarr.length, j = 0; j < jen; j++){ other.push(jarr[j]); } } return other;
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (5)
Previous results
Fork
Test case name
Result
Array.prototype.concat
spread operator
Push Spread
Push Apply
Push Loop
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):
Let's break down what's being tested on the provided JSON. **Benchmark Definition** The benchmark is designed to compare four different approaches for concatenating arrays: 1. `Array.prototype.concat()` 2. The spread operator (`...`) 3. The "push spread" approach (using `...` with `push`) 4. The "push apply" approach (using `apply()` with `push`) **Options Compared** The benchmark compares the performance of these four approaches on a large array concatenation task. Each test case creates an array of 500 elements, each element containing a unique number from 0 to 499. The arrays are then concatenated using the different approaches. **Pros and Cons of Each Approach:** 1. `Array.prototype.concat()`: This is the traditional method for concatenating arrays in JavaScript. It's simple and straightforward but can be slow for large arrays. * Pros: Easy to understand, widely supported * Cons: Can be slow, uses multiple function calls 2. Spread Operator (`...`): This is a new ES6 feature that allows you to concatenate arrays using the spread operator. * Pros: Fast, efficient, easy to read * Cons: Requires modern browsers and JavaScript versions 3. Push Spread: This approach combines the spread operator with the `push()` method. * Pros: Fast, efficient, concise * Cons: May not be as readable as other approaches 4. Push Apply: This approach uses the `apply()` function to call `push()` on an array. * Pros: Fast, efficient, flexible * Cons: May have performance overhead due to function call **Library and Purpose** In this benchmark, there is no explicit library being used beyond what's part of the JavaScript standard. However, it's worth noting that some modern browsers may use additional libraries or features for optimization. **Special JS Feature/Syntax** The spread operator (`...`) is a new feature introduced in ES6. It allows you to concatenate arrays using a more concise syntax than traditional array concatenation methods. **Other Alternatives** If you're interested in alternative approaches, here are a few: * Using `Array.prototype.reduce()` instead of loops for concatenation * Using `String.prototype.repeat()` or other string methods to create repeated arrays * Using native libraries like Apache Commons Lang's `ArrayListUtils` (for Java-like implementations) * Optimizing array concatenation using specialized algorithms, such as the "two-pointer" technique. Keep in mind that these alternatives may have different performance characteristics and trade-offs compared to the approaches tested in this benchmark.
Related benchmarks:
Array.prototype.concat vs spread operator
Array.prototype.concat vs spread operator big arrays
Array concat vs spread vs push spread, loop, apply Huge arrays
Array.prototype.concat vs spread operator on large array
Comments
Confirm delete:
Do you really want to delete benchmark?