Benchmark: Array.from vs map vs for vs push

Tests:

Array.from
Array.from({ length: 100 }, i => i)
Map
new Array(100).map(i => i);
Loop
const arr = new Array(10); for (let i = 0; i < 100; i++) arr[i] = i
Loop push
const arr = [] for (let i = 0; i < 100; i++) arr.push(i)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.from
Map
Loop
Loop push

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 120 on Windows

View result in a separate tab

Test name	Executions per second
Array.from	150907.1 Ops/sec
Map	2700065.0 Ops/sec
Loop	2239202.2 Ops/sec
Loop push	2341967.2 Ops/sec

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

LLMs can make mistakes. Check important info.

**What is being tested?**

MeasureThat.net is testing the performance of four different approaches to create an array of integers:

1. `Array.from()`
2. `map()` function
3. For loop
4. `push()` method on an empty array

These approaches are compared in terms of their execution speed.

**Options comparison:**

The test measures the execution speed of each approach, which is represented by the `ExecutionsPerSecond` value in the benchmark results.

* `Array.from()`: Creates a new array from an iterable or an array-like object.
* `map()`: Applies a transformation function to every element of an array and returns a new array with the results.
* For loop: Uses a traditional loop to create an array by assigning values to each index using the `$` symbol (not applicable in all browsers).
* `push()` method on an empty array: Creates a new array and pushes elements onto it.

**Pros and cons of each approach:**

1. **Array.from()**:
	* Pros: Efficient, concise, and modern.
	* Cons: May not work as expected with certain types of iterables or array-like objects.
2. **map()**:
	* Pros: Elegant, expressive, and widely supported.
	* Cons: May require additional memory allocation for the intermediate results.
3. **For loop**:
	* Pros: Traditional, familiar, and can be optimized for performance.
	* Cons: Less concise and may not be as efficient as other approaches.
4. **push()` method on an empty array**:
	* Pros: Simple and straightforward.
	* Cons: May be slower than other approaches due to the overhead of creating a new array.

**Library and purpose (if applicable):**

None of the test cases use any external libraries.

**Special JS features or syntax (if applicable):**

None of the test cases use special JavaScript features or syntax. The code is plain JavaScript.

**Other alternatives:**

Other approaches to create an array of integers might include:

* `Array.from()` with a custom function that creates the elements.
* Using `Buffer` or other native arrays instead of `Array`.
* Using Web Workers or other parallel computing techniques to speed up execution.

Note that these alternatives are not necessarily included in the benchmark results, and their performance may vary depending on the specific use case.

Related benchmarks:

Array.from vs map vs for vs push (version: 0)

Comparing performance of: Array.from vs Map vs Loop vs Loop push

Created: 2 years ago by: Guest

Jump to the latest result

Array.from

Map

Loop

Loop push

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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