Run results for: Direct access vs Class accessors vs Object.defineProperty

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:138.0) Gecko/20100101 Firefox/138.0

Browser: Firefox 138

Operating system: Mac OS X 10.15

Device Platform: Desktop

Date tested: one year ago

Increment accessor class value

4.9M/s

Increment basic class value

4.0M/s

Increment basic object value

4.0M/s

Increment setter class value

3.4M/s

Creation of basic object

2.9M/s

Increment setter object value

2.3M/s

Creation of setter class

1.2M/s

Creation of accessor class

1.2M/s

Creation of basic class

1.2M/s

Creation of setter object

1.2M/s

Increment accessor object value

150K/s

Creation of accessor object

27K/s

View exact numbers

Test name	Executions per second
✓ Increment accessor class value	4,904,254 Ops/sec
Increment basic class value	4,041,847 Ops/sec
Increment basic object value	4,033,590 Ops/sec
Increment setter class value	3,423,087 Ops/sec
Creation of basic object	2,912,916 Ops/sec
Increment setter object value	2,327,034 Ops/sec
Creation of setter class	1,249,192 Ops/sec
Creation of accessor class	1,247,497 Ops/sec
Creation of basic class	1,246,028 Ops/sec
Creation of setter object	1,188,749 Ops/sec
Increment accessor object value	149,902 Ops/sec
Creation of accessor object	27,031 Ops/sec

Script Preparation code:


function createBasicObject() {
  return { value: 0, dirty: false }
}

function createSetterObject() {
  const object = {
    value: 0,
    dirty: false,

    setValue(value) {
      if (value !== object.value) {
        object.value = value;
        object.dirty = true;
      }
    }
  }
  return object
}

function createAccessorObject() {
  let _value = 0;

  const object = {
    value: _value,
    dirty: false,
  };

  Object.defineProperty(object, "value", {
    get() {
      return _value;
    },
    set(value) {
      if (value !== _value) {
        _value = value;
        this.dirty = true;
      }
    },
  });

  return object;
}

class BasicClass {
  value = 0;
  dirty = false;
}

class SetterClass {
  value = 0;
  dirty = false;

  setValue(value) {
    if (value !== this.value) {
      this.value = value;
      this.dirty = true;
    }
  }
}

class AccessorClass {
  dirty = false;

  _value = 0;

  get value() {
    return this._value;
  }

  set value(value) {
    if (value !== this._value) {
      this._value = value;
      this.dirty = true;
    }
  }
}

const COUNT = 100

const basicObjects = new Array(COUNT)
for (let i=0; i<100; i++) {
  basicObjects[i] = createBasicObject()
}

const setterObjects = new Array(COUNT)
for (let i=0; i<100; i++) {
  setterObjects[i] = createSetterObject()
}

const accessorObjects = new Array(COUNT)
for (let i=0; i<100; i++) {
  accessorObjects[i] = createAccessorObject()
}

const basicClasses = new Array(COUNT)
for (let i=0; i<100; i++) {
  basicClasses[i] = new BasicClass()
}

const setterClasses = new Array(COUNT)
for (let i=0; i<100; i++) {
  setterClasses[i] = new SetterClass()
}

const accessorClasses = new Array(COUNT)
for (let i=0; i<100; i++) {
  accessorClasses[i] = new AccessorClass()
}

Tests:

Creation of basic object
const results = new Array(COUNT) for (let i=0; i<100; i++) { results[i] = createBasicObject() }
Creation of setter object
const results = new Array(COUNT) for (let i=0; i<100; i++) { results[i] = createSetterObject() }
Creation of accessor object
const results = new Array(COUNT) for (let i=0; i<100; i++) { results[i] = createAccessorObject() }
Creation of basic class
const results = new Array(COUNT) for (let i=0; i<100; i++) { results[i] = new BasicClass() }
Creation of setter class
const results = new Array(COUNT) for (let i=0; i<100; i++) { results[i] = new SetterClass() }
Creation of accessor class
const results = new Array(COUNT) for (let i=0; i<100; i++) { results[i] = new AccessorClass() }
Increment basic object value
for (let i=0; i<100; i++) { obj = basicObjects[i] obj.value++ obj.dirty = true }
Increment setter object value
for (let i=0; i<100; i++) { obj = setterObjects[i] obj.setValue(obj.value + 1) }
Increment accessor object value
for (let i=0; i<100; i++) { accessorObjects[i].value++ }
Increment basic class value
for (let i=0; i<100; i++) { obj = basicClasses[i] obj.value++ obj.dirty = true }
Increment setter class value
for (let i=0; i<100; i++) { obj = setterClasses[i] obj.setValue(obj.value + 1) }
Increment accessor class value
for (let i=0; i<100; i++) { accessorClasses[i].value++ }