Benchmark: Array Apply vs Array Spread vs Array Fill

Tests:

Array Fill

function createDateArrayInAMonth(year, month) {
    return new Array(new Date(year, month, 0).getDate()).fill().map((_, i) => new Date(year, month - 1, i + 1).toLocaleString())
}

createDateArrayInAMonth(2023, 10)

​x
 
function createDateArrayInAMonth(year, month) {    return new Array(new Date(year, month, 0).getDate()).fill().map((_, i) => new Date(year, month - 1, i + 1).toLocaleString())}​createDateArrayInAMonth(2023, 10)

Array Apply

function createDateArrayInAMonth(year, month) {
  return Array.apply(null, new Array(new Date(year, month, 0).getDate())).map((_, i) => new Date(year, month - 1, i + 1).toLocaleString())
}

createDateArrayInAMonth(2023, 10)

 
function createDateArrayInAMonth(year, month) {  return Array.apply(null, new Array(new Date(year, month, 0).getDate())).map((_, i) => new Date(year, month - 1, i + 1).toLocaleString())}​createDateArrayInAMonth(2023, 10)

Array Spread

function createDateArrayInAMonth(year, month) {
  return [...new Array(new Date(year, month, 0).getDate())].map((_, i) => new Date(year, month - 1, i + 1).toLocaleString())
}

createDateArrayInAMonth(2023, 10)

 
function createDateArrayInAMonth(year, month) {  return [...new Array(new Date(year, month, 0).getDate())].map((_, i) => new Date(year, month - 1, i + 1).toLocaleString())}​createDateArrayInAMonth(2023, 10)

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 Fill
Array Apply
Array Spread

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/119.0.0.0 Safari/537.36

Browser/OS: Chrome 119 on Windows

View result in a separate tab

Test name	Executions per second
Array Fill	14924.8 Ops/sec
Array Apply	14761.7 Ops/sec
Array Spread	14646.1 Ops/sec

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

Overview

The provided JSON represents a JavaScript benchmark test case on the MeasureThat.net website. The test compares three different approaches for creating an array of dates in a given month: Array Fill, Array Apply, and Array Spread. Each approach is measured and compared to determine which one performs best.

Approaches Compared

Array Fill: This method uses the fill() method to initialize an empty array with a specified length, followed by mapping over the array to create dates.
Array Apply: This method uses the apply() method to call a function on an array object, passing the desired number of elements as the first argument.
Array Spread: This method uses the spread operator (...) to create an array with a specified length, followed by mapping over the array to create dates.

Pros and Cons of Each Approach

Array Fill:
- Pros: Simple and concise syntax.
- Cons: May be slower due to the overhead of fill() method.
Array Apply:
- Pros: Can be more efficient for large arrays, as it avoids creating an intermediate array.
- Cons: Syntax can be less readable and more verbose than other approaches.
Array Spread:
- Pros: Modern syntax is concise and easy to read.
- Cons: May require a newer JavaScript engine to support the spread operator.

Library Usage

None of the test cases use any external libraries or dependencies.

Special JS Feature/Syntax

The map() function is used in all three approaches, which is a modern JavaScript feature that allows transforming arrays into new arrays. The toLocaleString() method is also used to format dates as strings.

Benchmark Results

The latest benchmark results show the following:

Test Name	Executions Per Second
Array Fill	14924.818359375
Array Apply	14761.6669921875
Array Spread	14646.08984375

The results indicate that Array Fill performs best, followed by Array Apply, and then Array Spread.

Alternative Approaches

Other approaches to creating an array of dates in a given month might include:

Using Array.from() method (a more modern and concise alternative to apply())
Utilizing a library like Lodash or Moment.js for date manipulation
Implementing a custom loop-based approach
Leveraging a Just-In-Time (JIT) compiler or other optimization techniques to improve performance.

LLMs can make mistakes. Check important info.

**Overview**

The provided JSON represents a JavaScript benchmark test case on the MeasureThat.net website. The test compares three different approaches for creating an array of dates in a given month: `Array Fill`, `Array Apply`, and `Array Spread`. Each approach is measured and compared to determine which one performs best.

**Approaches Compared**

1. **Array Fill**: This method uses the `fill()` method to initialize an empty array with a specified length, followed by mapping over the array to create dates.
2. **Array Apply**: This method uses the `apply()` method to call a function on an array object, passing the desired number of elements as the first argument.
3. **Array Spread**: This method uses the spread operator (`...`) to create an array with a specified length, followed by mapping over the array to create dates.

**Pros and Cons of Each Approach**

1. **Array Fill**:
	* Pros: Simple and concise syntax.
	* Cons: May be slower due to the overhead of `fill()` method.
2. **Array Apply**:
	* Pros: Can be more efficient for large arrays, as it avoids creating an intermediate array.
	* Cons: Syntax can be less readable and more verbose than other approaches.
3. **Array Spread**:
	* Pros: Modern syntax is concise and easy to read.
	* Cons: May require a newer JavaScript engine to support the spread operator.

**Library Usage**

None of the test cases use any external libraries or dependencies.

**Special JS Feature/Syntax**

The `map()` function is used in all three approaches, which is a modern JavaScript feature that allows transforming arrays into new arrays. The `toLocaleString()` method is also used to format dates as strings.

**Benchmark Results**

The latest benchmark results show the following:

| Test Name | Executions Per Second |
| --- | --- |
| Array Fill | 14924.818359375 |
| Array Apply | 14761.6669921875 |
| Array Spread | 14646.08984375 |

The results indicate that `Array Fill` performs best, followed by `Array Apply`, and then `Array Spread`.

**Alternative Approaches**

Other approaches to creating an array of dates in a given month might include:

* Using `Array.from()` method (a more modern and concise alternative to `apply()`)
* Utilizing a library like Lodash or Moment.js for date manipulation
* Implementing a custom loop-based approach
* Leveraging a Just-In-Time (JIT) compiler or other optimization techniques to improve performance.

Related benchmarks:

Array Apply vs Array Spread vs Array Fill (version: 0)

Comparing performance of: Array Fill vs Array Apply vs Array Spread

Created: one year ago by: Guest

Jump to the latest result