Benchmark: Create Square 2D Array

Script Preparation code:

var size = 15;

Tests:

While Loop with declaration
const array = []; array.length = size; let index = array.length; while (index-- > 0) { const temp = []; temp.length = size; array[index] = temp; }
While Loop with Slice
const array = []; array.length = size; let index = array.length; const temp = []; temp.length = size; while (index-- > 0) array[index] = temp.slice(0);
While Loop with Push and Slice
const array = []; array.length = size; let index = array.length; const temp = []; temp.length = size; while (index-- > 0) array.push(temp.slice(0));
While Loop with Push
const array = []; array.length = size; let index = size; while (index-- > 0) { const temp = []; temp.length = size; array.push(temp); }
Array.from with map
const array = Array.from(Array(size), () => { const temp = []; temp.length = size; return temp; });
Array.from with map and slice
const temp = []; temp.length = size; const array = Array.from(temp, () => temp.slice());

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
While Loop with declaration
While Loop with Slice
While Loop with Push and Slice
While Loop with Push
Array.from with map
Array.from with map and slice

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 87 on Windows

View result in a separate tab

Test name	Executions per second
While Loop with declaration	285314.0 Ops/sec
While Loop with Slice	1484854.5 Ops/sec
While Loop with Push and Slice	1377482.8 Ops/sec
While Loop with Push	282811.1 Ops/sec
Array.from with map	225431.3 Ops/sec
Array.from with map and slice	667623.4 Ops/sec

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

LLMs can make mistakes. Check important info.

**Overview**

MeasureThat.net is a website that allows users to create and run JavaScript microbenchmarks. The provided JSON represents a benchmark for creating a 2D square array filled with arrays of the same length.

**Benchmark Definition**

The benchmark definition consists of two parts:

1. **Script Preparation Code**: This code sets up the environment for the test. In this case, it simply declares a variable `size` and assigns it a value of 15.
2. **Html Preparation Code**: There is no HTML preparation code provided.

**Individual Test Cases**

There are six individual test cases that compare different approaches to creating a 2D square array:

1. **While Loop with Declaration**
```javascript
let index = array.length;
while (index-- > 0) {
  const temp = [];
  temp.length = size;
  array[index] = temp;
}
```
This approach uses a while loop to create each inner array and assigns it to the corresponding index in the outer array.

2. **While Loop with Slice**
```javascript
let index = array.length;
while (index-- > 0) {
  const temp = [];
  temp.length = size;
  array[index] = temp.slice(0);
}
```
This approach uses a while loop to create each inner array, and then slices the newly created array to assign it to the corresponding index in the outer array.

3. **While Loop with Push and Slice**
```javascript
let index = size;
while (index-- > 0) {
  const temp = [];
  temp.length = size;
  array.push(temp.slice(0));
}
```
This approach uses a while loop to create each inner array, slices the newly created array, and then pushes it onto the outer array using `push`.

4. **While Loop with Push**
```javascript
let index = size;
while (index-- > 0) {
  const temp = [];
  temp.length = size;
  array.push(temp);
}
```
This approach uses a while loop to create each inner array and pushes it onto the outer array using `push`.

5. **Array.from with map**
```javascript
const array = Array.from(Array(size), () => {
  const temp = [];
  temp.length = size;
  return temp;
});
```
This approach uses `Array.from()` to create an array of inner arrays, where each inner array is created using the provided callback function.

6. **Array.from with map and slice**
```javascript
const array = Array.from(temp, () => temp.slice());
```
This approach uses `Array.from()` to create an array of inner arrays, but instead of creating a new array for each iteration, it reuses the existing `temp` array by slicing it.

**Options Compared**

The benchmark compares six different approaches to creating a 2D square array:

* While Loop with Declaration
* While Loop with Slice
* While Loop with Push and Slice
* While Loop with Push
* Array.from with map
* Array.from with map and slice

Each approach has its own pros and cons:

**Pros and Cons**

1. **While Loop with Declaration**
	* Pros: Simple, easy to understand.
	* Cons: May be slower due to the overhead of incrementing a variable.
2. **While Loop with Slice**
	* Pros: Reuses the existing array for each iteration, potentially faster.
	* Cons: Requires an additional function call (`slice()`).
3. **While Loop with Push and Slice**
	* Pros: Simple, easy to understand.
	* Cons: May be slower due to the overhead of pushing elements onto an array.
4. **While Loop with Push**
	* Pros: Fast, efficient.
	* Cons: More complex, requires understanding of array manipulation.
5. **Array.from with map**
	* Pros: Fast, efficient, easy to understand.
	* Cons: Requires `Array.from()` and a callback function.
6. **Array.from with map and slice**
	* Pros: Reuses the existing array for each iteration, potentially faster.
	* Cons: More complex, requires understanding of array manipulation.

**Conclusion**

The benchmark provides insight into the performance characteristics of different approaches to creating a 2D square array in JavaScript. While Loop with Push appears to be the fastest approach, it also has the most complex logic. The `Array.from()` methods provide a good balance between performance and simplicity. Ultimately, the choice of approach depends on personal preference, coding style, and specific use case requirements.

Related benchmarks:

Create Square 2D Array (version: 0)

Create a 2D "square" array that is filled with arrays of the same length.

Comparing performance of: While Loop with declaration vs While Loop with Slice vs While Loop with Push and Slice vs While Loop with Push vs Array.from with map vs Array.from with map and slice

Created: 3 years ago by: Guest

Jump to the latest result

While Loop with declaration

While Loop with Slice

While Loop with Push and Slice

While Loop with Push

Array.from with map

Array.from with map and slice

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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