array access vs simple variable

Benchmark created on

Preparation HTML

<span></span>

Setup

let span = document.body.querySelector("span");

class Float32ArrayExtended extends Float32Array {
  
  constructor (val) {
    super(1);
    this[0] = val;
  }

  get x () { return this[0]; }
  set x (v) { this[0] = v; }
}

class Int32ArrayExtended extends Int32Array {
  
  constructor (val) {
    super(1);
    this[0] = val;
  }

  get x () { return this[0]; }let
  set x (v) { this[0] = v; }
}

const size = 100000;
const array = new Array(16).fill(1);
const arrayEF32 = new Float32ArrayExtended (16);
const arrayF32 = new Float32Array (16);
const arrayEI32 = new Int32ArrayExtended (16);
const arrayI32 = new Int32Array (16);
let x = 1;

const obj = {
    get x() {
        return array[0];
    },

    set x(value) {
        array[0] = value;
    }
};

let sum = 0;

Teardown

span.innerText = sum;

Test runner

Ready to run.

Testing in
TestOps/sec
array [ 0]
sum = 0;
for (let i = 0; i < size; i++) {
    array[0] = Math.random () * 1000;
    sum += array[0];
}
ready
setter / getter
sum = 0;
for (let i = 0; i < size; i++) {
    obj.x = Math.random () * 1000;
    sum += obj.x;
}
ready
Float32Array
sum = 0;
for (let i = 0; i < size; i++) {
    arrayF32[0] = Math.random () * 1000;
    sum += arrayF32[0];
}
ready
class extends Float32Array
sum = 0;
for (let i = 0; i < size; i++) {
    arrayEF32.x = Math.random () * 1000;
    sum += arrayEF32.x;
}
ready
Int32Array
sum = 0;
for (let i = 0; i < size; i++) {
    arrayI32[0] = Math.random () * 1000;
    sum += arrayI32[0];
}
ready
class extends Int32Array
sum = 0;
for (let i = 0; i < size; i++) {
    arrayEI32.x = Math.random () * 1000;
    sum += arrayEI32.x;
}
ready
Primitive
sum = 0;
for (let i = 0; i < size; i++) {
    x = Math.random () * 1000;
    sum += x;
}
ready
Direct
sum = 0;
for (let i = 0; i < size; i++)
    sum += Math.random () * 1000;
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.