Benchmark: from vs slice - MeasureThat.net

Script Preparation code:

var arr = []

for (var i = 0; i < 1000000; i++) {
  arr.push('')
}

Tests:

from
var n = Array.from(arr)
slice
var n2 = arr.slice()
destr
var n3 = [...arr]
while copy
var n4 = [] while(var arr.pop()) { n4.push(v) }
for copy
var n5 = [] for (var g = 0; g <= arr.length; g++ ) { n5.push(arr[g] }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
from
slice
destr
while copy
for copy

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's dive into the explanation of the provided benchmark.

**Benchmark Overview**

The benchmark is designed to compare the performance of different approaches to create a copy of an array in JavaScript. The test cases are as follows:

1. `var n = Array.from(arr)`
2. `var n2 = arr.slice()`
3. `var n3 = [...arr]` (also known as the "spread operator" approach)
4. `var n4 = []\r\n\r\nwhile(var arr.pop()) { n4.push(v) }` (also known as the "while copy" approach)
5. `var n5 = []\r\n\r\nfor (var g = 0; g <= arr.length; g++ ) { n5.push(arr[g] }` (also known as the "for copy" approach)

**Options Compared**

The benchmark compares the performance of five different approaches to create a copy of an array:

1. `Array.from()`: creates a new array from an existing array or iterable.
2. `slice()`: returns a shallow copy of a portion of an array.
3. Spread operator (`...arr`): creates a new array by spreading the elements of an existing array.
4. While loop copy (`while(var arr.pop()) { n4.push(v) }`)
5. For loop copy (`for (var g = 0; g <= arr.length; g++ ) { n5.push(arr[g] }`)

**Pros and Cons of Each Approach**

1. `Array.from()`: creates a new array with the same elements as the original array, but may not be suitable for very large arrays due to memory constraints.
	* Pros: efficient, reliable
	* Cons: may consume more memory, can be slower for very large arrays
2. `slice()`: returns a shallow copy of a portion of an array.
	* Pros: fast, efficient, and suitable for most use cases
	* Cons: may not preserve the original array's properties (e.g., prototype chain)
3. Spread operator (`...arr`): creates a new array by spreading the elements of an existing array.
	* Pros: modern, concise syntax
	* Cons: may be slower than `slice()` for very large arrays, can consume more memory
4. While loop copy (`while(var arr.pop()) { n4.push(v) }`):
	* Pros: simple, no additional library required
	* Cons: may be slower and less efficient than other approaches, requires manual handling of array elements
5. For loop copy (`for (var g = 0; g <= arr.length; g++ ) { n5.push(arr[g] }`):
	* Pros: straightforward, simple syntax
	* Cons: may be slower and less efficient than other approaches, prone to errors due to potential indexing issues

**Library Usage**

The `Array.from()` method uses the built-in `Array.prototype.from()` function, which is a part of the ECMAScript standard. The `slice()` method also uses a built-in function.

**Special JS Feature or Syntax**

None of the test cases use any special JavaScript features or syntax beyond what is covered in the ECMAScript standard.

**Other Alternatives**

If you need to create a copy of an array, there are other alternatives you can consider:

* Using `Array.prototype.map()` and then spreading the resulting array using the spread operator (`...`)
* Using a library like Lodash's `cloneDeep()` function
* Using a data structure like a linked list or a tree instead of an array

Keep in mind that each approach has its trade-offs, and the best choice depends on your specific use case and performance requirements.

Latest run results:

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

User agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/64.0.3282.167 Chrome/64.0.3282.167 Safari/537.36

Browser/OS: Chromium 64 on Ubuntu

View result in a separate tab

Test name	Executions per second
from	3.8 Ops/sec
slice	45.0 Ops/sec

Related benchmarks:

from vs slice (version: 4)

Comparing performance of: from vs slice vs destr vs while copy vs for copy

Created: 6 years ago by: Registered User

Jump to the latest result

from

slice

destr

while copy

for copy

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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