Benchmark: lodash range vs Array.from vs keys() + spread 234das

HTML Preparation code:


<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>

Script Preparation code:

var size = 10000;

Tests:

lodash range
_.range(size);
array from
[...Array(size)]

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
lodash range
array from

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 8 months ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/136.0.0.0 Safari/537.36

Browser/OS: Chrome 136 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
lodash range	58989.5 Ops/sec
array from	85517.2 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what is being tested.

**Benchmark Description**

The benchmark measures the performance of two different ways to create an array in JavaScript: using `_.range()` from Lodash, and using the spread operator (`[...]`) with `Array(size)`.

**Options Compared**

1. **Lodash `_range()`**: This function generates a new array of numbers starting from 0 and incrementing by 1 until it reaches the specified size.
2. **`Array.from([...])`**: This creates a new array by duplicating an existing iterable (in this case, an array with a single element). The `...` spread operator is used to create the new array.

**Pros and Cons of Each Approach**

* **Lodash `_range()`**:
	+ Pros: Often faster than using the spread operator, as it avoids creating an intermediate array.
	+ Cons: Requires importing Lodash library, which can add overhead.
* **`Array.from([...])`**:
	+ Pros: Easier to read and understand for some developers, as it uses a familiar syntax.
	+ Cons: Creates an intermediate array, which can be slower than using `_range()` directly.

**Other Considerations**

Both approaches have different use cases. If you need to generate a sequence of numbers for processing or iteration, `_.range()` might be a better choice. However, if you're working with existing arrays and want to create a new one by duplicating it, the spread operator is often sufficient.

**Special JavaScript Feature/Syntax**

The benchmark uses ES6 syntax (e.g., `var size = 10000;`, `[...Array(size)]`) and also imports Lodash library via a CDN (`<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>`). No special features or syntax are used here.

**Other Alternatives**

For creating arrays, other approaches exist:

* Using `Array()`: `new Array(size)`
* Using `Array.from(iterable)`: This creates a new array from an existing iterable (e.g., another array).
* Using `concat()`: `Array.concat(new Array(size))`
* Manually looping and pushing elements to the array.

However, these alternatives might not be as concise or readable as using the spread operator or `_range()`.

**Benchmark Result**

The benchmark result shows that Chrome 104 on a desktop with Mac OS X 10.15.7 is executing `Array.from([...])` approximately 2.6x faster than `_.range(size)`, which might not be surprising given their different use cases and performance characteristics.

Related benchmarks:

lodash range vs Array.from vs keys() + spread 234das (version: 0)

Comparing performance of: lodash range vs array from

Created: 3 years ago by: Guest

Jump to the latest result

lodash range

array from

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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