Benchmark: Array.from vs Array spread with mapping of values2

Script Preparation code:

var arr = ['a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c'];

AخA
 
var arr = ['a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c', 'a', 'b', 'c'];

Tests:

Array.from
Array.from(arr, name => name + name)
Array.from(arr, name => name + name)
Spread
[...arr].map(name => name +name)
[...arr].map(name => name +name)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

Memory measurements supported only in Chrome.
For precise memory measurements Chrome must be launched with --enable-precise-memory-info flag.
More information: Monitoring JavaScript Memory

Test case name	Result
Array.from
Spread

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Linux; Android 7.0; LG-M400) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.101 Mobile Safari/537.36

Browser/OS: Chrome Mobile 87 on Android 7.0

View result in a separate tab

Test name	Executions per second
Array.from	5513.0 Ops/sec
Spread	15155.0 Ops/sec

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

Let's dive into the world of JavaScript microbenchmarks on MeasureThat.net.

The provided benchmark defines two test cases: Array.from and Spread. Both tests are designed to measure the performance of creating an array from a given input using different approaches.

Test Case 1: Array.from

In this test case, the benchmark uses the Array.from() method with a callback function that concatenates each element in the array with itself (e.g., "a" + "a").

The purpose of this test is to compare the performance of Array.from() with a custom loop or other methods for creating an array from a given input.

Pros and Cons:

Pros:
- Uses a well-established JavaScript method, making it easy to understand and implement.
- Allows for customization through the callback function.
Cons:
- May have slower performance compared to native array operations due to the overhead of creating an iterator object and iterating over its elements.

Test Case 2: Spread

In this test case, the benchmark uses the spread operator (...) with the map() method to create a new array from the input array. The callback function is used to concatenate each element in the array with itself (e.g., "a" + "name").

The purpose of this test is to compare the performance of using the spread operator with map() versus a custom loop or other methods for creating an array from a given input.

Pros and Cons:

Pros:
- Uses modern JavaScript syntax, making it easy to understand and implement.
- Can be faster than traditional loops due to the use of native array operations.
Cons:
- May have slower performance compared to custom loops or other methods that avoid the overhead of map().

Other Considerations:

The benchmark uses a fixed-size input array with 25 elements, which may not be representative of real-world scenarios.
The benchmark runs on a mobile device (Chrome Mobile 87) with an Android operating system, which may affect the results due to differences in hardware and software configurations.
The benchmark measures the number of executions per second, which can be affected by various factors such as CPU frequency, memory availability, and other system resources.

Latest Benchmark Result:

The latest benchmark result shows that the Spread test case performs better than the Array.from test case on this specific device and configuration. However, it's essential to note that these results may not be representative of all devices and configurations.

In conclusion, both tests provide valuable insights into the performance of different methods for creating an array from a given input in JavaScript. The choice between using Array.from() or the spread operator with map() ultimately depends on the specific requirements and constraints of your project.

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks on MeasureThat.net.

The provided benchmark defines two test cases: `Array.from` and `Spread`. Both tests are designed to measure the performance of creating an array from a given input using different approaches.

**Test Case 1: Array.from**

In this test case, the benchmark uses the `Array.from()` method with a callback function that concatenates each element in the array with itself (e.g., `"a" + "a"`).

The purpose of this test is to compare the performance of `Array.from()` with a custom loop or other methods for creating an array from a given input.

**Pros and Cons:**

* **Pros:**
	+ Uses a well-established JavaScript method, making it easy to understand and implement.
	+ Allows for customization through the callback function.
* **Cons:**
	+ May have slower performance compared to native array operations due to the overhead of creating an iterator object and iterating over its elements.

**Test Case 2: Spread**

In this test case, the benchmark uses the spread operator (`...`) with the `map()` method to create a new array from the input array. The callback function is used to concatenate each element in the array with itself (e.g., `"a" + "name"`).

The purpose of this test is to compare the performance of using the spread operator with `map()` versus a custom loop or other methods for creating an array from a given input.

**Pros and Cons:**

* **Pros:**
	+ Uses modern JavaScript syntax, making it easy to understand and implement.
	+ Can be faster than traditional loops due to the use of native array operations.
* **Cons:**
	+ May have slower performance compared to custom loops or other methods that avoid the overhead of `map()`.

**Other Considerations:**

* The benchmark uses a fixed-size input array with 25 elements, which may not be representative of real-world scenarios.
* The benchmark runs on a mobile device (Chrome Mobile 87) with an Android operating system, which may affect the results due to differences in hardware and software configurations.
* The benchmark measures the number of executions per second, which can be affected by various factors such as CPU frequency, memory availability, and other system resources.

**Latest Benchmark Result:**

The latest benchmark result shows that the `Spread` test case performs better than the `Array.from` test case on this specific device and configuration. However, it's essential to note that these results may not be representative of all devices and configurations.

In conclusion, both tests provide valuable insights into the performance of different methods for creating an array from a given input in JavaScript. The choice between using `Array.from()` or the spread operator with `map()` ultimately depends on the specific requirements and constraints of your project.

Related benchmarks:

Array.from vs Array spread with mapping of values2 (version: 0)

Comparing performance of: Array.from vs Spread

Created: 4 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 6 months ago):