Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Array.prototype.concat vs splice vs loop for joining lots of arrays
(version: 0)
Comparing performance of:
immutable with concat vs mutation with splice + spread vs mutation with splice into preallocated array vs mutation with loop-assign
Created:
7 years ago
by:
Guest
Jump to the latest result
Tests:
immutable with concat
var a = [] var b = [ "hello", "jello" ] for (var i = 0; i < 1000; i++) { a = a.concat(b) }
mutation with splice + spread
var a = [] var b = [ "hello", "jello" ] for (var i = 0; i < 1000; i++) { a.splice(a.length, 0, ...b) }
mutation with splice into preallocated array
var a = new Array(2000) var b = [ "hello", "jello" ] for (var i = 0; i < 1000; i++) { a.splice(i * b.length, b.length, ...b) }
mutation with loop-assign
var a = new Array(2000) var b = [ "hello", "jello" ] for (var i = 0; i < 1000; i++) { for (var j = 0; j < b.length; j++) { a[i+j] = b[j] } }
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (4)
Previous results
Fork
Test case name
Result
immutable with concat
mutation with splice + spread
mutation with splice into preallocated array
mutation with loop-assign
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):
I'll break down the provided benchmark definition and test cases. **Benchmark Definition** The benchmark measures the performance of different approaches for joining lots of arrays in JavaScript. The options being compared are: 1. `Array.prototype.concat()` 2. `Array.prototype.splice()` with spread operator (`...`) 3. `Array.prototype.splice()` without spread operator 4. Loop-assign (using a nested loop to assign elements) **Pros and Cons of each approach:** 1. `concat()`: This method creates a new array by concatenating the existing arrays. It's efficient because it avoids mutating the original array. * Pros: Efficient, no mutation of original array * Cons: Creates a new array, can be slower for large inputs 2. `splice()` with spread operator (`...`): This method inserts one or more elements at specified position(s) in an existing array. It's efficient because it avoids mutating the original array. * Pros: Efficient, no mutation of original array * Cons: Can be slower than `concat()` due to additional overhead of inserting elements 3. `splice()` without spread operator: This method mutates the original array by deleting and replacing existing elements with new ones. * Pros: Fastest approach (mutating the original array) * Cons: Mutates the original array, can be slower for large inputs **Loop-assign**: This method uses a nested loop to assign elements from one array to another. * Pros: Can be faster than `splice()` with spread operator due to reduced overhead of inserting elements * Cons: Slowest approach (mutating the original array), requires more CPU cycles **Library and purpose** None of the test cases use any external libraries. They only rely on built-in JavaScript functions. **Special JS features or syntax** The benchmark uses some special JavaScript features: 1. Spread operator (`...`): Used in `splice()` with spread operator to insert elements. 2. Immutable arrays: The `concat()` method creates a new array, while the other approaches modify an existing array (although `concat()` doesn't mutate the original array). **Other alternatives** If the test cases didn't use any external libraries or special JavaScript features, alternative approaches could be: 1. Using `Array.prototype.reduce()`: Instead of using a loop to join arrays, you can use `reduce()` to concatenate elements. 2. Using `String.join()`: If the goal is to concatenate strings, you can use `String.join()` instead of any array-related methods. 3. Using `Array.prototype.push()`: You can push each element from one array to another using `push()` instead of `splice()`. However, these alternatives might not be as efficient or straightforward as the original approaches, and may require additional considerations depending on the specific use case.
Related benchmarks:
Concat vs Slice
array methods test1231234
Concat vs Slice f1
Concat vs Spread for Large Arrayss
Spread operator vs Array.prototype.concat()
Comments
Confirm delete:
Do you really want to delete benchmark?