Benchmark: push vs set length and index vs index vs typedArray to array vs typedArray

Tests:

push
const arr = [] const length = 100000 for(let i = 0; i < length; i++) { arr.push(i, 1) } console.log(arr[0], arr[100], arr[1000], arr[10001], arr[20000])
set length and index
const arr = [] const length = 100000 arr.length = length*2+1 for(let i = 0; i < length; i++) { arr[i*2] = i; arr[i*2+1] = 1; } console.log(arr[0], arr[100], arr[1000], arr[10001], arr[20000])
index
const arr = [] const length = 100000 for(let i = 0; i < length; i++) { arr[i*2] = i; arr[i*2+1] = 1; } console.log(arr[0], arr[100], arr[1000], arr[10001], arr[20000])
typedArray to js array
const typedArray = new Int8Array(20001); const length = 100000 for(let i = 0; i < length; i++) { typedArray[i*2] = i; typedArray[i*2+1] = 1; } const arr = Array.from(typedArray); console.log(arr[0], arr[100], arr[1000], arr[10001], arr[20000])
typedArray
const arr = new Int8Array(20001); const length = 100000 for(let i = 0; i < length; i++) { arr[i*2] = i; arr[i*2+1] = 1; } console.log(arr[0], arr[100], arr[1000], arr[10001], arr[20000])

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
push
set length and index
index
typedArray to js array
typedArray

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

Browser/OS: Chrome 117 on Windows

View result in a separate tab

Test name	Executions per second
push	565.5 Ops/sec
set length and index	1912.7 Ops/sec
index	573.6 Ops/sec
typedArray to js array	1716.8 Ops/sec
typedArray	3651.3 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the explanation of the provided benchmark.

**What is being tested?**

The benchmark tests four different approaches to populate an array with values and then access those values:

1. **Push**: Using the `push()` method to add elements to the end of the array.
2. **Set length and index**: Setting the length property of the array and accessing elements by their index directly.
3. **Index**: Similar to the previous approach, but without setting the length explicitly.
4. **TypedArray to JavaScript array**: Converting a TypedArray (a binary data type) to a regular JavaScript array using `Array.from()`.

**Options compared**

The benchmark compares the performance of these four approaches:

* Push vs Set length and index
* Index vs TypedArray to JavaScript array

**Pros and cons of each approach:**

1. **Push**:
	* Pros: Simple, efficient, and widely supported.
	* Cons: Can be slower for large arrays due to the overhead of pushing elements individually.
2. **Set length and index**:
	* Pros: Can be faster than push for large arrays since it avoids the overhead of individual element pushes.
	* Cons: Requires setting the length property explicitly, which can be error-prone and may not work as expected if the array is modified later.
3. **Index**:
	* Pros: Similar to Set length and index, but without the need to set the length property explicitly.
	* Cons: May still incur overhead due to individual element accesses.
4. **TypedArray to JavaScript array**:
	* Pros: Can be faster than push and Set length and index since it uses a more efficient data structure (TypedArray).
	* Cons: Requires converting the TypedArray to a regular JavaScript array using `Array.from()`, which can incur additional overhead.

**Library used**

In this benchmark, no specific library is mentioned. However, the use of `Int8Array` suggests that the benchmark is written for performance-critical code and may be targeting modern browser implementations.

**Special JS feature or syntax**

The benchmark uses a few features that are not commonly encountered in everyday JavaScript development:

* The `for...of` loop (not explicitly used here, but implied by the use of `push()` and indexing) is not explicitly mentioned.
* The use of `Array.from()` to convert a TypedArray to a regular JavaScript array.

**Other alternatives**

Some alternative approaches that are not tested in this benchmark include:

* Using `splice()` to insert elements at specific indices.
* Using a library like Lodash or Ramda for array manipulation.
* Using a different data structure, such as an object or a Map, instead of an array.

Related benchmarks:

push vs set length and index vs index vs typedArray to array vs typedArray (version: 0)

Comparing performance of: push vs set length and index vs index vs typedArray to js array vs typedArray

Created: one year ago by: Guest

Jump to the latest result

push

set length and index

index

typedArray to js array

typedArray

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):