Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
Feature Requests
FAQ
Register
Log In
Slice vs Splice insert element to array
(version: 0)
Benchmark.js
Compares the speed for add/remove 1 items of an array
Comparing performance of:
insert by join multi sub-array vs insert by using splice
Created:
3 years ago
by:
Guest
Go to the latest result
Script Preparation code:
var array = [] for (let i = 0; i < 100000; i++) {array.push(i)} var indexToRemove = 6700 var indexToInsert = 4200
Tests:
insert by join multi sub-array
array = array.slice(0,indexToInsert).concat('meo', array.slice(indexToInsert, indexToRemove), array.slice(indexToRemove+1, array.length))
insert by using splice
array.splice(indexToRemove, 1) array.splice(indexToInsert, 0, 'meo')
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
insert by join multi sub-array
insert by using splice
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
one year ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/133.0.0.0 Safari/537.36
Browser/OS:
Chrome 133 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=590683" width="100%" height="500px"></iframe>
insert by using splice
65K/s
insert by join multi sub-array
4K/s
View exact numbers
Test name
Executions per second
✓
insert by using splice
64,542 Ops/sec
insert by join multi sub-array
4,034 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
I'll explain the benchmark in detail. **Benchmark Overview** The benchmark is designed to compare the performance of two approaches for inserting an element into an array: using `slice` and concatenation, versus using `splice`. **Script Preparation Code** The script preparation code creates a large array with 100,000 elements and then sets two indices to remove and insert elements at specific positions. The indices are set as follows: * Remove index (6700): the element will be removed from the array. * Insert index (4200): the element "meo" will be inserted into the array. **Benchmark Definition** The benchmark definition is a JSON object that contains two test cases: 1. **Insert by join multi sub-array**: This test case uses the `slice` method to create multiple sub-arrays, inserts the element "meo" at the desired index, and then concatenates the sub-arrays back together. 2. **Insert by using splice**: This test case uses the `splice` method to remove one element from the array and then inserts the element "meo" at the desired index. **Options Compared** The two options being compared are: 1. Using `slice` with concatenation: this approach creates multiple sub-arrays, inserts the element, and then concatenates them back together. 2. Using `splice`: this approach removes one element from the array and then inserts the element at the desired index. **Pros and Cons** Here are some pros and cons of each approach: * **Using `slice` with concatenation**: + Pros: creates a new copy of the original array, which can be beneficial for certain use cases (e.g., when modifying the original array is not desirable). + Cons: creates multiple sub-arrays, which can lead to higher memory usage and slower performance. * **Using `splice`**: + Pros: modifies the original array in-place, which can be more efficient than creating a new copy. + Cons: removes one element from the array before inserting the new element, which can lead to unexpected behavior if the index is not correctly calculated. **Library and Its Purpose** In this benchmark, the `slice` method is used to create sub-arrays. The `slice` method is a built-in JavaScript method that returns a shallow copy of a portion of an array. It is commonly used to extract a subset of elements from an array. **Special JS Feature or Syntax** There are no special JS features or syntax used in this benchmark, except for the use of template literals (e.g., `array.push(i)`), which is a relatively modern feature introduced in ECMAScript 2015 (ES6). **Other Alternatives** If you were to implement this benchmark using alternative approaches, some options could be: 1. Using `concat` instead of `slice`: `concat` is another method that creates a new array by concatenating two or more arrays. 2. Using a library like Lodash: Lodash provides various utility methods for working with arrays, including `insertAt`. 3. Using a different data structure, such as a linked list or a tree. Keep in mind that these alternative approaches may not be directly comparable to the original benchmark, as they may introduce additional overhead or modify the array in ways that are not equivalent to the original implementation.
Related benchmarks
Slice vs Splice vs Shift
Slice vs Splice vs Shift (Large Array)
Slice vs Splice vs Shift for 1 item
Slice vs Splice vs Shift (More itemsToRemove)
Slice vs Splice vs Shift vs Spread syntax
Comments
Confirm delete:
Do you really want to delete benchmark?