Benchmark: Array.from vs Array.prototype.map

Tests:

Array.from
var l = Array.from([1, 2, 3, 4, 5, 6, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7], (elm) => elm*4); return l;
Array.prototype.map
var l = [1, 2, 3, 4, 5, 6, 7, 7, 7, 7, 7, 7, 7, 7, 7, 7].map((elm) => elm*4); return l;

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.from
Array.prototype.map

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/113.0.0.0 Safari/537.36

Browser/OS: Chrome 113 on Windows

View result in a separate tab

Test name	Executions per second
Array.from	1173685.4 Ops/sec
Array.prototype.map	8889714.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the benchmark and its results.

**Benchmark Purpose:**
The purpose of this benchmark is to compare the performance of two approaches for creating an array of multiplied elements:

1. Using `Array.from()` with a callback function.
2. Using `Array.prototype.map()` with a callback function.

**Options Compared:**

* **`Array.from()`**: Creates a new array from an existing iterable (in this case, an array). It takes two arguments: the iterable and a callback function that defines the mapping or filtering of elements to create new values.
* **`Array.prototype.map()`**: Applies a specified function to each element in an array and returns a new array with the results. It also takes two arguments: the array and a callback function.

**Pros and Cons:**

* **`Array.from()`**:
	+ Pros:
		- Creates a new array, which can be useful if you need to preserve the original array.
		- Can be faster for large datasets since it avoids mutating the original array.
	+ Cons:
		- Requires an additional function call and may incur overhead due to creating a new array.
* **`Array.prototype.map()`**:
	+ Pros:
		- Mutates the original array, which can be beneficial if you don't need to preserve the original data.
		- Can be faster since it avoids creating a new array, but this depends on the specific use case and browser performance.
	+ Cons:
		- May cause unexpected changes to the original array if not used carefully.

**Library/Dependency:**
There is no explicit library dependency mentioned in the benchmark definition. However, both `Array.from()` and `Array.prototype.map()` are built-in methods in JavaScript.

**Special JS Features/Syntax:**
None of the test cases use any special JavaScript features or syntax that would affect the interpretation of the results.

**Other Alternatives:**

* For creating an array from a specific length and filling it with values, you can use `Array.from()` with the desired length and initial value.
* To achieve similar performance to `Array.prototype.map()`, you can create a new array using `Array.from()` or another method like `slice()`.
* If you need to preserve the original array, you may want to consider using `Array.prototype.slice()` instead of `Array.from()`.

Keep in mind that these alternatives might have different trade-offs in terms of performance, memory usage, and code readability.

Related benchmarks:

Array.from vs Array.prototype.map (version: 0)

Comparing performance of: Array.from vs Array.prototype.map

Created: 2 years ago by: Guest

Jump to the latest result

Array.from

Array.prototype.map

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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