Benchmark: Array.prototype.concat vs spread operator Two

HTML Preparation code:

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.core.js"></script>

Tests:

Array.prototype.concat
var params = [ "hello", true, 7 ]; var other = params.concat(params);
spread operator
var params = [ "hello", true, 7 ] var other = [ ...params, ...params ]
lodash concat
var params = [ "hello", true, 7 ]; var other = _.concat(params, params);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.prototype.concat
spread operator
lodash concat

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

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

LLMs can make mistakes. Check important info.

Let's break down what's being tested in the provided benchmark.

**Benchmark Definition**

The website is comparing three approaches to concatenate an array of values: `Array.prototype.concat()`, the spread operator (`...`), and a variant using Lodash (`_.concat()`).

**Options compared**

1. **Array.prototype.concat()**: This method creates a new array by concatenating two or more arrays.
2. **Spread operator (`...`)**: This is a new syntax introduced in ECMAScript 2018 that allows for spreading the elements of an iterable (like an array) into a new array.
3. **Lodash concat (`_.concat()`)**: Lodash is a utility library that provides a `concat` function, which concatenates two or more arrays.

**Pros and cons**

1. **Array.prototype.concat()**:
	* Pros: Wide browser support (long-standing method), relatively simple implementation.
	* Cons: Creates a new array on each invocation, can be slower for large datasets.
2. **Spread operator (`...`)**:
	* Pros: Concise syntax, creates a new array without the need for explicit function calls.
	* Cons: Introduced in ECMAScript 2018, might not work in older browsers or environments.
3. **Lodash concat (`_.concat()`)**:
	* Pros: Widely supported (Lodash is a popular utility library), provides additional features like handling null/undefined values and arrays with different lengths.
	* Cons: Adds an external dependency (Lodash), can be slower due to the function call overhead.

**Library usage**

The `lodash.core.js` script is included in the HTML preparation code, which makes Lodash available for use in the benchmark. The `_concat` function from Lodash is used as a third approach for concatenating arrays.

**Special JS features or syntax**

There's no special JavaScript feature or syntax being tested here; it's all about comparing different array concatenation methods.

**Other alternatives**

If you'd like to add more approaches, some other options could include:

* Using `Array.prototype.push()` and setting the length property manually.
* Utilizing a library like `reduce` (e.g., `_.reduce()` from Lodash) for concatenation.
* Comparing the performance of different sorting algorithms before concatenating.

Related benchmarks:

Array.prototype.concat vs spread operator Two (version: 0)

Compare the new ES6 spread operator with the traditional concat() method

Comparing performance of: Array.prototype.concat vs spread operator vs lodash concat

Created: 7 years ago by: Guest

Jump to the latest result

Array.prototype.concat

spread operator

lodash concat

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

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