Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Array.prototype.slice vs spread operator.
(version: 0)
Compare the ES6 spread operator with the traditional slice() method
Comparing performance of:
Array.prototype.slice vs spread operator
Created:
6 years ago
by:
Guest
Go to the latest result
Script Preparation code:
var a = [ "hello", true, 7 ];
Tests:
Array.prototype.slice
var b = a.slice();
spread operator
var b = [ ...a ]
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
Array.prototype.slice
spread operator
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
4 months ago
)
User agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:149.0) Gecko/20100101 Firefox/149.0
Browser/OS:
Firefox 149 on Windows
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=627376" width="100%" height="500px"></iframe>
Array.prototype.slice
66.2M/s
spread operator
62.1M/s
View exact numbers
Test name
Executions per second
✓
Array.prototype.slice
66,216,792 Ops/sec
spread operator
62,067,904 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's dive into the world of JavaScript benchmarking. **Benchmark Definition and Purpose** The provided JSON represents a simple benchmark that compares two approaches to create a shallow copy of an array: `Array.prototype.slice()` vs the ES6 spread operator (`[ ...a ]`). **Options Compared** 1. **Array.prototype.slice()**: This method returns a new, shallow copy of the specified portion of an array. 2. **ES6 Spread Operator (`[ ...a ]`)**: This syntax creates a new array with elements taken from the original array. **Pros and Cons** * `Array.prototype.slice()`: + Pros: widely supported across browsers, efficient in most cases. + Cons: can be slower than the spread operator for large arrays due to the overhead of creating a new function. * ES6 Spread Operator (`[ ...a ]`): + Pros: concise and expressive syntax, can be faster than `slice()` for large arrays. + Cons: not supported in older browsers or versions (pre-ES6), may lead to slower performance in some cases. **Library and Purpose** None in this specific benchmark. However, the spread operator relies on the `Symbol.iterator` and `Array.prototype.forEach` methods internally, which are built-in JavaScript features. **Special JS Feature/Syntax** The ES6 spread operator (`[ ...a ]`) uses a new syntax feature introduced by ECMAScript 2015 (ES6). This feature allows for concise array creation using the `...` operator. **Other Considerations** * The benchmark results show that Chrome 84 on a Desktop Mac OS X 10.15.6 achieves significantly higher execution frequencies per second for both test cases compared to other browsers or platforms. * To make this benchmark more comprehensive, you could consider adding tests for other JavaScript engines (e.g., Node.js), older browsers, or additional array operations. **Alternatives** 1. **Benchmarking frameworks**: For more complex benchmarks, consider using dedicated benchmarking frameworks like BenchmarkJS or Benchmark-chrome. 2. **Test cases**: Consider adding more test cases to cover different scenarios, such as: * Larger arrays * Nested arrays * Objects with nested properties * Array operations (e.g., `map()`, `filter()`) By expanding the benchmark suite and considering various factors, you can gain a better understanding of your JavaScript code's performance characteristics.
Related benchmarks
Array.prototype.slice vs spread operator With slightly bigger array
Array.prototype.slice vs spread operator on a bigger array
Array.prototype.slice vs spread operator - large array 100000
Array.prototype.slice vs spread operator performance
Comments
Confirm delete:
Do you really want to delete benchmark?