diff --git a/packages/reactivity/src/computed.ts b/packages/reactivity/src/computed.ts index d2dd67bf97c..a5f8e5a3c2b 100644 --- a/packages/reactivity/src/computed.ts +++ b/packages/reactivity/src/computed.ts @@ -3,14 +3,13 @@ import { type DebuggerEvent, type DebuggerOptions, EffectFlags, - type Link, type Subscriber, activeSub, refreshComputed, } from './effect' import type { Ref } from './ref' import { warn } from './warning' -import { Dep, globalVersion } from './dep' +import { Dep, type Link, globalVersion } from './dep' import { ReactiveFlags, TrackOpTypes } from './constants' declare const ComputedRefSymbol: unique symbol diff --git a/packages/reactivity/src/dep.ts b/packages/reactivity/src/dep.ts index 6e0d43cce35..8e4ad1e649e 100644 --- a/packages/reactivity/src/dep.ts +++ b/packages/reactivity/src/dep.ts @@ -4,7 +4,7 @@ import { type TrackOpTypes, TriggerOpTypes } from './constants' import { type DebuggerEventExtraInfo, EffectFlags, - type Link, + type Subscriber, activeSub, endBatch, shouldTrack, @@ -18,6 +18,49 @@ import { */ export let globalVersion = 0 +/** + * Represents a link between a source (Dep) and a subscriber (Effect or Computed). + * Deps and subs have a many-to-many relationship - each link between a + * dep and a sub is represented by a Link instance. + * + * A Link is also a node in two doubly-linked lists - one for the associated + * sub to track all its deps, and one for the associated dep to track all its + * subs. + * + * @internal + */ +export class Link { + /** + * - Before each effect run, all previous dep links' version are reset to -1 + * - During the run, a link's version is synced with the source dep on access + * - After the run, links with version -1 (that were never used) are cleaned + * up + */ + version: number + + /** + * Pointers for doubly-linked lists + */ + nextDep?: Link + prevDep?: Link + nextSub?: Link + prevSub?: Link + prevActiveLink?: Link + + constructor( + public sub: Subscriber, + public dep: Dep, + ) { + this.version = dep.version + this.nextDep = + this.prevDep = + this.nextSub = + this.prevSub = + this.prevActiveLink = + undefined + } +} + /** * @internal */ @@ -52,16 +95,7 @@ export class Dep { let link = this.activeLink if (link === undefined || link.sub !== activeSub) { - link = this.activeLink = { - dep: this, - sub: activeSub, - version: this.version, - nextDep: undefined, - prevDep: undefined, - nextSub: undefined, - prevSub: undefined, - prevActiveLink: undefined, - } + link = this.activeLink = new Link(activeSub, this) // add the link to the activeEffect as a dep (as tail) if (!activeSub.deps) { diff --git a/packages/reactivity/src/effect.ts b/packages/reactivity/src/effect.ts index 678ee1982fe..32ea8ee0c81 100644 --- a/packages/reactivity/src/effect.ts +++ b/packages/reactivity/src/effect.ts @@ -1,7 +1,7 @@ import { extend, hasChanged } from '@vue/shared' import type { ComputedRefImpl } from './computed' import type { TrackOpTypes, TriggerOpTypes } from './constants' -import { type Dep, globalVersion } from './dep' +import { type Link, globalVersion } from './dep' import { activeEffectScope } from './effectScope' import { warn } from './warning' @@ -72,41 +72,6 @@ export interface Subscriber extends DebuggerOptions { notify(): void } -/** - * Represents a link between a source (Dep) and a subscriber (Effect or Computed). - * Deps and subs have a many-to-many relationship - each link between a - * dep and a sub is represented by a Link instance. - * - * A Link is also a node in two doubly-linked lists - one for the associated - * sub to track all its deps, and one for the associated dep to track all its - * subs. - * - * @internal - */ -export interface Link { - dep: Dep - sub: Subscriber - - /** - * - Before each effect run, all previous dep links' version are reset to -1 - * - During the run, a link's version is synced with the source dep on access - * - After the run, links with version -1 (that were never used) are cleaned - * up - */ - version: number - - /** - * Pointers for doubly-linked lists - */ - nextDep?: Link - prevDep?: Link - - nextSub?: Link - prevSub?: Link - - prevActiveLink?: Link -} - const pausedQueueEffects = new WeakSet() export class ReactiveEffect