Benchmark: Getter / Setter vs Proxy vs Class getter

Script Preparation code:

data1 = {};
handler = {
  get: (target, prop) => (target[prop]),
  set: (target, prop, value) => (target[prop] = value),
};
proxy = new  Proxy(data1, handler);
data2 = {
  get test() {
    return this._test;
  },
  set test(value) {
    return this._test = value;
  }
};

class Data3 {
    _test;
  
	get test()
    {
      return this._test;
    }
    set test(value)
    {
      this._test = value;
    }
}
data3 = new Data3();

Tests:

setter getter
data2.test = Math.random(); console.log(data2.test);
proxy
proxy.test = Math.random(); console.log(proxy.test);
class getter setter
data3.test = Math.random()

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
setter getter
proxy
class getter setter

Fastest: N/A

Slowest: N/A

ⓘ Get performance results from real users on your website with Request Metrics.

Website Performance Monitoring by Request Metrics

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

Browser/OS: Chrome 111 on Windows

View result in a separate tab

Test name	Executions per second
setter getter	77507.7 Ops/sec
proxy	77148.4 Ops/sec
class getter setter	2166275.0 Ops/sec

Getter / Setter vs Proxy vs Class getter (version: 0)

Comparing performance of: setter getter vs proxy vs class getter setter

Created: one year ago by: Guest

Jump to the latest result

setter getter

proxy

class getter setter

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A