Skip to content

Commit ccd3f3f

Browse files
committed
refactor(reactivity): only setup onTrigger debug flags on assign
1 parent 313dc61 commit ccd3f3f

File tree

3 files changed

+24
-10
lines changed

3 files changed

+24
-10
lines changed

packages/reactivity/src/computed.ts

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { hasChanged, isFunction } from '@vue/shared'
22
import { ReactiveFlags, TrackOpTypes } from './constants'
3-
import { onTrack, setupFlagsHandler } from './debug'
3+
import { onTrack, setupOnTrigger } from './debug'
44
import {
55
type DebuggerEvent,
66
type DebuggerOptions,
@@ -130,9 +130,6 @@ export class ComputedRefImpl<T = any> implements IComputed {
130130
private readonly setter: ComputedSetter<T> | undefined,
131131
) {
132132
this[ReactiveFlags.IS_READONLY] = !setter
133-
if (__DEV__) {
134-
setupFlagsHandler(this)
135-
}
136133
}
137134

138135
get value(): T {
@@ -188,6 +185,10 @@ export class ComputedRefImpl<T = any> implements IComputed {
188185
}
189186
}
190187

188+
if (__DEV__) {
189+
setupOnTrigger(ComputedRefImpl)
190+
}
191+
191192
/**
192193
* Takes a getter function and returns a readonly reactive ref object for the
193194
* returned value from the getter. It can also take an object with get and set

packages/reactivity/src/debug.ts

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -44,12 +44,24 @@ export function onTrigger(sub: Link['sub']): void {
4444
}
4545
}
4646

47-
export function setupFlagsHandler(target: Subscriber): void {
47+
export function setupOnTrigger(target: { new (...args: any[]): any }): void {
4848
if (!__DEV__) {
4949
throw new Error(
50-
`Internal error: setupFlagsHandler should be called only in development.`,
50+
`Internal error: setupOnTrigger should be called only in development.`,
5151
)
5252
}
53+
Object.defineProperty(target.prototype, 'onTrigger', {
54+
get() {
55+
return this._onTrigger
56+
},
57+
set(val) {
58+
if (!this._onTrigger) setupFlagsHandler(this)
59+
this._onTrigger = val
60+
},
61+
})
62+
}
63+
64+
function setupFlagsHandler(target: Subscriber): void {
5365
// @ts-expect-error
5466
target._flags = target.flags
5567
Object.defineProperty(target, 'flags', {

packages/reactivity/src/effect.ts

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { extend } from '@vue/shared'
22
import type { TrackOpTypes, TriggerOpTypes } from './constants'
3-
import { setupFlagsHandler } from './debug'
3+
import { setupOnTrigger } from './debug'
44
import { activeEffectScope } from './effectScope'
55
import {
66
type IEffect,
@@ -74,9 +74,6 @@ export class ReactiveEffect<T = any> implements IEffect, ReactiveEffectOptions {
7474
if (activeEffectScope && activeEffectScope.active) {
7575
activeEffectScope.effects.push(this)
7676
}
77-
if (__DEV__) {
78-
setupFlagsHandler(this)
79-
}
8077
}
8178

8279
get active(): boolean {
@@ -176,6 +173,10 @@ export class ReactiveEffect<T = any> implements IEffect, ReactiveEffectOptions {
176173
}
177174
}
178175

176+
if (__DEV__) {
177+
setupOnTrigger(ReactiveEffect)
178+
}
179+
179180
export interface ReactiveEffectRunner<T = any> {
180181
(): T
181182
effect: ReactiveEffect

0 commit comments

Comments
 (0)