Skip to content

Commit

Permalink
perf(ssr): avoid calling markRaw on component instance proxy
Browse files Browse the repository at this point in the history
The previous behavior invokes the definePropery proxy trap on the
instance proxy and has massive overhead. This change improves Vue
ops/sec by 40% in https://github.com/eknkc/ssr-benchmark
  • Loading branch information
yyx990803 committed Apr 12, 2024
1 parent 34106bc commit 4bc9f39
Show file tree
Hide file tree
Showing 2 changed files with 6 additions and 2 deletions.
3 changes: 1 addition & 2 deletions packages/runtime-core/src/component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -775,8 +775,7 @@ function setupStatefulComponent(
// 0. create render proxy property access cache
instance.accessCache = Object.create(null)
// 1. create public instance / render proxy
// also mark it raw so it's never observed
instance.proxy = markRaw(new Proxy(instance.ctx, PublicInstanceProxyHandlers))
instance.proxy = new Proxy(instance.ctx, PublicInstanceProxyHandlers)
if (__DEV__) {
exposePropsOnRenderContext(instance)
}
Expand Down
5 changes: 5 additions & 0 deletions packages/runtime-core/src/componentPublicInstance.ts
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ import {
isString,
} from '@vue/shared'
import {
ReactiveFlags,
type ShallowUnwrapRef,
TrackOpTypes,
type UnwrapNestedRefs,
Expand Down Expand Up @@ -307,6 +308,10 @@ const hasSetupBinding = (state: Data, key: string) =>

export const PublicInstanceProxyHandlers: ProxyHandler<any> = {
get({ _: instance }: ComponentRenderContext, key: string) {
if (key === ReactiveFlags.SKIP) {
return true
}

const { ctx, setupState, data, props, accessCache, type, appContext } =
instance

Expand Down

0 comments on commit 4bc9f39

Please sign in to comment.