Benchmark: true copy - MeasureThat.net

Script Preparation code:

const featured = ['Deep dish', 'Peperoni', 'Hawaiian'];
const specialty = ['Meatzza', 'Spicy Nama', 'Margherita'];

let pizzas = [...featured, 'veg', ...specialty];

Tests:

Array.prototype.slice
const featured = ['Deep dish', 'Peperoni', 'Hawaiian']; const specialty = ['Meatzza', 'Spicy Nama', 'Margherita']; let pizzas = [...featured, 'veg', ...specialty]; const copyPizzas1 = pizzas.slice();
Array.prototype.concat
const featured = ['Deep dish', 'Peperoni', 'Hawaiian']; const specialty = ['Meatzza', 'Spicy Nama', 'Margherita']; let pizzas = [...featured, 'veg', ...specialty]; const copyPizzas2 = [].concat(pizzas);
spread operator
const featured = ['Deep dish', 'Peperoni', 'Hawaiian']; const specialty = ['Meatzza', 'Spicy Nama', 'Margherita']; let pizzas = [...featured, 'veg', ...specialty]; const copyPizzas3 = [...pizzas];
Array.from
const featured = ['Deep dish', 'Peperoni', 'Hawaiian']; const specialty = ['Meatzza', 'Spicy Nama', 'Margherita']; let pizzas = [...featured, 'veg', ...specialty]; const copyPizzas4 = Array.from(pizzas);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.prototype.slice
Array.prototype.concat
spread operator
Array.from

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 29 days ago):

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks!

**Benchmark Overview**

The provided benchmark measures the performance of different approaches for creating copies of arrays in JavaScript. The test cases are designed to compare the efficiency of `Array.prototype.slice()`, `Array.prototype.concat()`, spread operator (`...`), and `Array.from()` methods.

**Options Compared**

1. **Array.prototype.slice()**: Creates a shallow copy of an array by returning a new array object with references to the same elements as the original array.
2. **Array.prototype.concat()**: Concatenates two or more arrays into a single array, creating a new array object.
3. **Spread Operator (`...`)**: Spreads the elements of an iterable (such as an array) into a new array, creating a shallow copy.
4. **Array.from()**: Creates a new array from an iterable (such as an array or string), creating a shallow copy.

**Pros and Cons**

1. **Array.prototype.slice()**:
	* Pros: Efficient for large arrays, creates a shallow copy.
	* Cons: Can be slow for small arrays due to the overhead of function calls.
2. **Array.prototype.concat()**:
	* Pros: Creates a new array object, which can be beneficial for memory management.
	* Cons: Can be slower than `slice()` for large arrays and creates a deep copy (not shallow).
3. **Spread Operator (`...`)**:
	* Pros: Efficient for small to medium-sized arrays, creates a shallow copy.
	* Cons: Can be slow for very large arrays due to the overhead of creating new elements.
4. **Array.from()**:
	* Pros: Creates a new array object with the same performance characteristics as `slice()`, but is more flexible and can handle other iterables.
	* Cons: Can create a deep copy if not used carefully.

**Library Usage**

None of the test cases use any external libraries, so there are no library-specific considerations to discuss.

**Special JS Features or Syntax**

None of the test cases use special JavaScript features or syntax beyond what's required for the benchmarks. However, it's worth noting that some browsers may have specific optimizations or bug fixes applied to certain methods (e.g., `Array.prototype.slice()`).

**Alternatives**

If you're looking for alternative approaches for creating array copies, consider:

1. **Buffer**: A low-level buffer class that can be used to create efficient copies of arrays.
2. **Typed Arrays**: A family of classes designed specifically for working with arrays of numeric values (e.g., `Uint8Array`, `Int32Array`).
3. **Other libraries or frameworks**: Some libraries, like Lodash, offer their own implementations of array copy methods that may be optimized for performance.

In general, the choice of which method to use depends on your specific requirements and constraints, such as memory management, performance considerations, or compatibility with different browsers or environments.

Latest run results:

Run details: (Test run date: 4 years ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.135 Safari/537.36

Browser/OS: Chrome 84 on Mac OS X 10.15.5

View result in a separate tab

Test name	Executions per second
Array.prototype.slice	13817982.0 Ops/sec
Array.prototype.concat	4033617.5 Ops/sec
spread operator	12598043.0 Ops/sec
Array.from	3687524.0 Ops/sec

Related benchmarks:

true copy (version: 0)

Comparing performance of: Array.prototype.slice vs Array.prototype.concat vs spread operator vs Array.from

Created: 4 years ago by: Registered User

Jump to the latest result

Array.prototype.slice

Array.prototype.concat

spread operator

Array.from

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 29 days ago):