const obj = {
a: 'a',
b: 'b',
c: 'c'
}
const proxyReflect = new Proxy(obj, {
get(target, key, receiver) {
return Reflect.get(target, key, receiver)
}
})
const proxy = new Proxy(obj, {
get(target, key, receiver) {
return target[key]
}
})
function getAFromProxy() {
return proxy.a;
}
function getA() {
return obj.a;
}
function getAFromFunction() {
return getA()
}
function getAFromProxyReflect() {
return proxyReflect.a;
}
const outerProxyGetFunction = new Proxy({}, {
get(target, key, receiver) {
return getAFromFunction()
}
})
const outerProxyProxy = new Proxy({}, {
get() {
return getAFromProxy()
}
})
const outerProxyProxyReflect = new Proxy({}, {
get() {
return getAFromProxyReflect()
}
})
function getOuterProxyGetFunction(){
return outerProxyGetFunction
}
function getOuterProxyProxyAccess(){
return outerProxyProxy
}
function getOuterProxyReflectAccess(){
return outerProxyProxyReflect
}
getAFromFunction()
getAFromProxy()
getAFromProxyReflect()
getOuterProxyGetFunction()
getOuterProxyProxyAccess().a
getOuterProxyReflectAccess()
--enable-precise-memory-info
flag.
Test case name | Result |
---|---|
Get Function | |
proxy target[key] | |
proxy Reflect.get | |
get function wrapped in proxy | |
proxy wrapped in proxy | |
proxy Reflect wrapped in proxy |
Test name | Executions per second |
---|---|
Get Function | 2827007.5 Ops/sec |
proxy target[key] | 8516738.0 Ops/sec |
proxy Reflect.get | 3260483.5 Ops/sec |
get function wrapped in proxy | 12656738.0 Ops/sec |
proxy wrapped in proxy | 4294401.5 Ops/sec |
proxy Reflect wrapped in proxy | 12784567.0 Ops/sec |
The provided JSON represents a JavaScript microbenchmarking test case, where users can compare the performance of different approaches to accessing a property in an object.
Options being compared:
proxy target[key]
: This approach uses the built-in bracket notation ([]
) to access the property.Reflect.get
: This approach uses the Reflect
API to dynamically get the property value.get function
: This approach defines a separate function (getAFromFunction
) to access the property, and then uses this function within another proxy.Pros and Cons:
proxy target[key]
:Reflect.get
:proxy target[key]
, but may have a slight performance overhead due to the additional API call.Reflect
API, which might not be available in older browsers or environments.get function
:Library usage:
None of the test cases explicitly use any external libraries.
Special JS features or syntax:
The Reflect
API is used in the Reflect.get
approach, which is a relatively modern feature introduced in ECMAScript 2015. It provides a way to dynamically access and manipulate property values without modifying the original object.
Benchmark preparation code explanation:
The provided script prepares three proxies:
proxy
: A basic proxy that directly accesses the property using the bracket notation ([]
).proxyReflect
: A proxy that uses Reflect.get
to dynamically get the property value.outerProxyGetFunction
, outerProxyProxy
, and outerProxyReflect
: Additional proxies created by wrapping another proxy in a new one, which allows for further experimentation with different access approaches.Other alternatives:
Object.prototype.hasOwnProperty.call()
instead of bracket notation ([]
) to access the property.Object.keys()
or Object.values()
to iterate over the object's properties.Keep in mind that the specific options and approaches being compared are intentionally designed to test various aspects of JavaScript's proxy mechanism and dynamic property access.