Run results for: Object.defineProperty vs Object.assign vs Assign to Proxy

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/18.1.1 Safari/605.1.15

Browser: Safari 18

Operating system: Mac OS X 10.15.7

Device Platform: Desktop

Date tested: 18 days ago

Test name	Executions per second
Object.defineProperty	69697.4 Ops/sec
Object.assign (immutable)	5074.5 Ops/sec
Object.assign (mutable)	63578.0 Ops/sec
Object.defineProperty on Proxy	49542.0 Ops/sec
Property direct on Proxy	55574.6 Ops/sec
Direct Object Property	137501.1 Ops/sec
Object.defineProperty with getter and setter	51337.7 Ops/sec
Object.defineProperties (plural) with getter and setter	38619.8 Ops/sec
Object.defineProperty on Proxy with getter and setter	40973.5 Ops/sec

Script Preparation code:

var input = new Array(100).fill().map((v, i) => i);
var proxyHandlers = {
  get(target, prop, receiver) {
    return Reflect.get(target, prop, receiver);
  },
  set(target, prop, value) {
    return Reflect.set(target, prop, value);
  },
  defineProperty(target, prop, descriptor) {
    return Reflect.defineProperty(target, prop, descriptor);
  },  
};

Tests:

Object.defineProperty
const output = input.reduce((acc, value) => Object.defineProperty(acc, `key${value}`, { value }), {});
Object.assign (immutable)
const output = input.reduce((acc, value) => Object.assign({}, acc, { [`key${value}`]: value }), {});
Object.assign (mutable)
const output = input.reduce((acc, value) => Object.assign(acc, { [`key${value}`]: value }), {});
Object.defineProperty on Proxy
const output = input.reduce((acc, value) => Object.defineProperty(acc, `key${value}`, { value }), new Proxy({}, proxyHandlers));
Property direct on Proxy
const output = input.reduce((acc, value) => { acc[`key${value}`] = value; return acc; }, new Proxy({}, proxyHandlers));
Direct Object Property
const output = input.reduce((acc, value) => { acc[`key${value}`] = value; return acc; }, {});
Object.defineProperty with getter and setter
const output = input.reduce((acc, value) => Object.defineProperty(acc, `key${value}`, { get(){return value}, set(v) {} }), {});
Object.defineProperties (plural) with getter and setter
const output = input.reduce((acc, value) => Object.defineProperties(acc, {[`key${value}`]: { get(){return value}, set(v) {} }}), {});
Object.defineProperty on Proxy with getter and setter
const output = input.reduce((acc, value) => Object.defineProperty(acc, `key${value}`, { get(){return value}, set(v) {} }), new Proxy({}, proxyHandlers));
Object.assign on Proxy (mutable)
const output = input.reduce((acc, value) => Object.assign(acc, { [`key${value}`]: value }), new Proxy({}, proxyHandlers));

Run results for: Object.defineProperty vs Object.assign vs Assign to Proxy

Object.defineProperty

Object.assign (immutable)

Object.assign (mutable)

Object.defineProperty on Proxy

Property direct on Proxy

Direct Object Property

Object.defineProperty with getter and setter

Object.defineProperties (plural) with getter and setter

Object.defineProperty on Proxy with getter and setter

Object.assign on Proxy (mutable)