Run results for: Cached Getter (class) vs Getter vs Proxy

Run details:

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

Browser: Chrome 101

Operating system: Mac OS X 10.15.7

Device Platform: Desktop

Date tested: 2 years ago

Test name	Executions per second
getter / setter	3155475.2 Ops/sec
proxy	2908095.5 Ops/sec
plain object	3285975.8 Ops/sec
class getter	3385412.2 Ops/sec
cached class getter	3590134.2 Ops/sec

Script Preparation code:

plainObj = {test: 1};
handler = {
  get: (target, prop) => (target[prop]),
};
proxy = new  Proxy(plainObj, handler);


class ClassGetterSetter {
  constructor() {
    this._test = 1;
  }
  get test() {
    return this._test;
  }
}

class CachedGetterSetter {
  constructor() {
    this._test = 1;
  }
  get test() {
    var val = this._test;
    //this.test = val;
    
    Object.defineProperty(this, 'test', {
  		value: val,
    });
    
    return val;
  }
}


objWithGetter = {
  _test: 1,
  get test() {
    return this._test;
  },
};

objWithClass = new ClassGetterSetter();
objWithCachedClass = new CachedGetterSetter();


var a = 0;

objWithCachedClass.test;

Tests:

getter / setter
a += objWithGetter.test;
proxy
a += proxy.test;
plain object
a += plainObj.test;
class getter
a += objWithClass.test;
cached class getter
a += objWithCachedClass.test;

Run results for: Cached Getter (class) vs Getter vs Proxy

getter / setter

proxy

plain object

class getter

cached class getter