Benchmark: array from vs spread

Script Preparation code:


var arr = ['', '', ''];

Tests:

array.from
Array.from(arr)
spread
[...arr]

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
array.from
spread

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!

**What is being tested?**

The provided JSON represents two test cases that compare the performance of creating an array using the `Array.from()` method versus the spread operator (`[...]`) with the same initial array.

**Options compared:**

1. **`Array.from(arr)`**: This option uses the `Array.from()` method, which is a modern JavaScript method introduced in ECMAScript 2015 (ES6). It creates a new array by cloning and mapping over an existing iterable (in this case, the string array `arr`). The purpose of using `Array.from()` is to create a new array while preserving the original data.
2. **`[...arr]`**: This option uses the spread operator (`[...]`) to create a new array from the elements of the original array `arr`. The purpose of using the spread operator is to create a shallow copy of the array, which can be more efficient in some cases.

**Pros and Cons:**

* **`Array.from(arr)`**:
	+ Pros:
		- Creates a new array that preserves the original data.
		- Can be more readable and maintainable for complex operations.
	+ Cons:
		- May incur overhead due to the creation of an intermediate array (or a " cloned" version).
		- Might not be suitable for very large arrays, as it could lead to memory issues.
* **`[...arr]`**:
	+ Pros:
		- Creates a shallow copy of the array, which can be more efficient for small to medium-sized arrays.
		- More concise and readable syntax.
	+ Cons:
		- Does not preserve the original data; instead, it creates a new array that references the same elements.
		- Can lead to unexpected behavior if modified after creation.

**Library usage:**

None of the provided test cases use any external libraries. The tests are focused solely on comparing the performance of the two approaches using built-in JavaScript methods.

**Special JS feature or syntax:**

There is no special feature or syntax mentioned in the provided code snippets, except for the spread operator (`[...]`), which is a relatively modern feature introduced in ECMAScript 2015 (ES6).

**Other alternatives:**

If you're looking for alternative approaches to create an array, consider using:

1. **`new Array(length)`**: Creates a new array with a specified length and initial value.
2. **`Array.prototype.fill()`**: Fills a new array with a specified value, starting from the beginning of the array.

For example:
```javascript
var arr = new Array(3);
arr[0] = 'a';
arr[1] = 'b';
arr[2] = 'c';

// or

var arr = [];
for (var i = 0; i < 3; i++) {
  arr.push(i);
}
```
Keep in mind that these alternatives may have different performance characteristics and trade-offs, depending on your specific use case.

I hope this explanation helps you understand the provided benchmark test cases!

Latest run results:

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

User agent: Mozilla/5.0 (Linux; Android 9; TA-1012) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.112 Mobile Safari/537.36

Browser/OS: Chrome Mobile 74 on Android

View result in a separate tab

Test name	Executions per second
array.from	1810574.1 Ops/sec
spread	4714750.5 Ops/sec

Related benchmarks:

array from vs spread (version: 0)

Comparing performance of: array.from vs spread

Created: 5 years ago by: Guest

Jump to the latest result

array.from

spread

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):