Benchmark: Array vs Float32Array vs Float64Array multiplication

Script Preparation code:

const len = 16384;
window.len = len;
window.arr = new Array(len);
window.f32 = new Float32Array(len);
window.f64 = new Float64Array(len);
for (let i = 0; i < len; i++) {
  window.arr[i] = Math.random() * 2048;
  window.f32 = Math.fround(window.arr[i]);
  window.f64 = window.arr[i];
}

​x
 
const len = 16384;window.len = len;window.arr = new Array(len);window.f32 = new Float32Array(len);window.f64 = new Float64Array(len);for (let i = 0; i < len; i++) {  window.arr[i] = Math.random() * 2048;  window.f32 = Math.fround(window.arr[i]);  window.f64 = window.arr[i];}​

Tests:

Plain array

let a = 0;
for (let i = 1; i < window.len; i++) {
  a = window.arr[i] * window.arr[i - 1];
}

 
let a = 0;for (let i = 1; i < window.len; i++) {  a = window.arr[i] * window.arr[i - 1];}

Float32 Array

let a = 0;
for (let i = 1; i < window.len; i++) {
  a = window.f32[i] * window.f32[i - 1];
}

 
let a = 0;for (let i = 1; i < window.len; i++) {  a = window.f32[i] * window.f32[i - 1];}

Float64 Array

let a = 0;
for (let i = 1; i < window.len; i++) {
  a = window.f64[i] * window.f64[i - 1];
}

 
let a = 0;for (let i = 1; i < window.len; i++) {  a = window.f64[i] * window.f64[i - 1];}

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
Plain array
Float32 Array
Float64 Array

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 23 days ago)

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

Browser/OS: Chrome 133 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Plain array	21286.1 Ops/sec
Float32 Array	1497.4 Ops/sec
Float64 Array	1544.5 Ops/sec

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

Let's dive into the world of JavaScript microbenchmarks on MeasureThat.net.

Benchmark Overview

The benchmark measures the performance of multiplying two array elements using different data types: plain arrays, Float32Arrays, and Float64Arrays. The test case uses these data types to store random numbers generated by Math.random() and then multiplies corresponding elements together.

Script Preparation Code

Before running the benchmark, the script preparation code initializes three variables:

window.len: sets the length of the arrays (16384 in this case).
window.arr, window.f32, and window.f64: create new arrays with len elements and initialize them with random numbers generated using Math.random().

Options Compared

The benchmark compares three options:

Plain Array (window.arr): uses a traditional JavaScript array for storing and manipulating data.
Float32Array (window.f32): uses a typed array optimized for 32-bit floating-point operations, which can provide better performance for numerical computations compared to plain arrays.
Float64Array (window.f64): uses another typed array optimized for 64-bit floating-point operations.

Pros and Cons

Here's a brief summary of the pros and cons of each option:

Plain Array
- Pros: widely supported, easy to use, no additional dependencies required.
- Cons: slower performance due to JavaScript overhead.
Float32Array
- Pros: optimized for 32-bit floating-point operations, potentially faster than plain arrays.
- Cons: requires a specific type of data, limited support in older browsers or environments.
Float64Array
- Pros: optimized for 64-bit floating-point operations, potentially even faster than Float32Array.
- Cons: requires a specific type of data, may not be supported in all browsers or environments.

Library Usage

None of the benchmark options use any additional libraries beyond what's included with the JavaScript language itself. The performance difference is mainly due to the inherent characteristics of each data type.

Special JS Features/Syntax

No special JavaScript features or syntax are used in this benchmark, so it should be compatible with most environments that support modern JavaScript (ES6+).

Alternative Approaches

If you need better performance for numerical computations, consider using:

Native Web Workers: offload computationally intensive tasks to separate threads, potentially achieving better parallelization and performance.
Compiled JavaScript Interpreters: use just-in-time compilation or ahead-of-time compilation tools like V8 (used by Chrome) or SpiderMonkey (used by Firefox) to generate optimized machine code for the browser engine.

Please note that these alternatives may require additional setup, dependencies, or expertise in optimizing code for specific performance requirements.

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks on MeasureThat.net.

**Benchmark Overview**

The benchmark measures the performance of multiplying two array elements using different data types: plain arrays, Float32Arrays, and Float64Arrays. The test case uses these data types to store random numbers generated by `Math.random()` and then multiplies corresponding elements together.

**Script Preparation Code**

Before running the benchmark, the script preparation code initializes three variables:

1. `window.len`: sets the length of the arrays (16384 in this case).
2. `window.arr`, `window.f32`, and `window.f64`: create new arrays with `len` elements and initialize them with random numbers generated using `Math.random()`.

**Options Compared**

The benchmark compares three options:

1. **Plain Array (`window.arr`)**: uses a traditional JavaScript array for storing and manipulating data.
2. **Float32Array (`window.f32`)**: uses a typed array optimized for 32-bit floating-point operations, which can provide better performance for numerical computations compared to plain arrays.
3. **Float64Array (`window.f64`)**: uses another typed array optimized for 64-bit floating-point operations.

**Pros and Cons**

Here's a brief summary of the pros and cons of each option:

1. **Plain Array**
	* Pros: widely supported, easy to use, no additional dependencies required.
	* Cons: slower performance due to JavaScript overhead.
2. **Float32Array**
	* Pros: optimized for 32-bit floating-point operations, potentially faster than plain arrays.
	* Cons: requires a specific type of data, limited support in older browsers or environments.
3. **Float64Array**
	* Pros: optimized for 64-bit floating-point operations, potentially even faster than Float32Array.
	* Cons: requires a specific type of data, may not be supported in all browsers or environments.

**Library Usage**

**Special JS Features/Syntax**

No special JavaScript features or syntax are used in this benchmark, so it should be compatible with most environments that support modern JavaScript (ES6+).

**Alternative Approaches**

If you need better performance for numerical computations, consider using:

1. **Native Web Workers**: offload computationally intensive tasks to separate threads, potentially achieving better parallelization and performance.
2. **Compiled JavaScript Interpreters**: use just-in-time compilation or ahead-of-time compilation tools like V8 (used by Chrome) or SpiderMonkey (used by Firefox) to generate optimized machine code for the browser engine.

Please note that these alternatives may require additional setup, dependencies, or expertise in optimizing code for specific performance requirements.

Related benchmarks:

Array vs Float32Array vs Float64Array multiplication (version: 3)

Comparing performance of: Plain array vs Float32 Array vs Float64 Array

Created: 2 years ago by: Registered User

Jump to the latest result