Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Cloning array: Array.from vs spread
(version: 0)
Comparing performance of:
Array.from vs Spread
Created:
6 years ago
by:
Guest
Jump to the latest result
Script Preparation code:
const array = window.array = [] for (let i = 1000; i; --i) array.push(i)
Tests:
Array.from
window.a = Array.from(array)
Spread
window.b = Array.from(array)
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
Array.from
Spread
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 dive into the world of JavaScript microbenchmarks. **Benchmark Definition** The benchmark measures the performance difference between two approaches: using `Array.from()` and spreading an array (`...array`) to create a new copy. **Options being compared** Two options are being compared: 1. **`Array.from(array)`**: This approach uses the `Array.from()` method, which takes an iterable (in this case, the `array` variable) as an argument and returns a new array containing all elements from the original iterable. 2. **Spreading an array (`...array`)**: This approach uses the spread operator (`...`) to create a new array by copying all elements from the original `array`. **Pros and Cons of each approach** 1. **`Array.from(array)`**: * Pros: More explicit and readable, as it clearly conveys the intent of creating a new array. * Cons: May have performance overhead due to the method call and creation of an intermediate array. 2. **Spreading an array (`...array`)**: * Pros: Often faster, as it avoids the method call and intermediate array creation. * Cons: Less explicit and readable, as the intent is not immediately clear. In general, `Array.from()` can be a good choice when you need more control over the created array or when working with older browsers that don't support the spread operator. However, spreading an array using the `...` operator can be faster in modern browsers. **Library and purpose** None mentioned in this specific benchmark definition. **Special JS feature or syntax** The spread operator (`...`) is used in both test cases. The spread operator was introduced in ECMAScript 2015 (ES6) as a concise way to create a new array by copying elements from an existing array. It's supported in modern browsers and Node.js versions starting from ES6. **Other alternatives** If you want to explore other approaches, here are some alternatives: * Using `slice()` or `map()` with an empty callback function to create a shallow copy of the array: `Array.prototype.slice.call(array)` or `array.map(() => {})`. * Using `JSON.parse(JSON.stringify(array))` (not recommended due to security concerns and performance overhead). * Using libraries like Lodash's `cloneDeep()` or `_.clone()`. Keep in mind that these alternatives might have different performance characteristics and trade-offs, so it's essential to test them thoroughly for your specific use case.
Related benchmarks:
Cloning array: Array.from vs spread (correction)
Cloning array: Array.from vs spread corrected
Javascript: Spread vs push
Slice vs spread array
Comments
Confirm delete:
Do you really want to delete benchmark?