wip

Author: johnsoncodehk

packages/reactivity/src/effect.ts

@@ -96,12 +96,12 @@ export class ReactiveEffect<T = any> implements ReactiveEffectOptions {
   }
 
   resume(): void {
-    const flags = this.flags
+    let flags = this.flags
     if (flags & EffectFlags.PAUSED) {
-      this.flags &= ~EffectFlags.PAUSED
+      this.flags = flags &= ~EffectFlags.PAUSED
     }
     if (flags & EffectFlags.NOTIFIED) {
-      this.flags &= ~EffectFlags.NOTIFIED
+      this.flags = flags &= ~EffectFlags.NOTIFIED
       this.notify()
     }
   }

packages/reactivity/src/ref.ts

@@ -144,7 +144,7 @@ class RefImpl<T = any> implements Dependency {
     if (hasChanged(newValue, oldValue)) {
       this._rawValue = newValue
       this._value =
-        this._wrap && !useDirectValue ? this._wrap(newValue) : newValue
+        !useDirectValue && this._wrap ? this._wrap(newValue) : newValue
       if (__DEV__) {
         triggerEventInfos.push({
           target: this,
@@ -154,7 +154,10 @@ class RefImpl<T = any> implements Dependency {
           oldValue,
         })
       }
-      triggerRef(this as unknown as Ref)
+      const subs = this.subs
+      if (subs !== undefined) {
+        propagate(subs)
+      }
       if (__DEV__) {
         triggerEventInfos.pop()
       }

packages/runtime-core/src/renderer.ts

@@ -1599,8 +1599,7 @@ function baseCreateRenderer(
     instance.scope.off()
 
     const update = (instance.update = effect.run.bind(effect))
-    const job: SchedulerJob = (instance.job = () =>
-      effect.dirty && effect.run())
+    const job: SchedulerJob = (instance.job = effect.scheduler.bind(effect))
     job.i = instance
     job.id = instance.uid
     effect.scheduler = () => queueJob(job)

packages/runtime-core/src/scheduler.ts

@@ -97,7 +97,8 @@ function findInsertionIndex(id: number, isPre: boolean) {
  * @internal for runtime-vapor only
  */
 export function queueJob(job: SchedulerJob, isPre = false): void {
-  if (!(job.flags! & SchedulerJobFlags.QUEUED)) {
+  const flags = job.flags!
+  if (!(flags & SchedulerJobFlags.QUEUED)) {
     if (job.id === undefined) {
       job.id = isPre ? -1 : Infinity
     }
@@ -113,9 +114,7 @@ export function queueJob(job: SchedulerJob, isPre = false): void {
       queue.splice(findInsertionIndex(job.id, isPre), 0, job)
     }
     isPre ? preJobsLength++ : mainJobsLength++
-
-    job.flags! |= SchedulerJobFlags.QUEUED
-
+    job.flags! = flags | SchedulerJobFlags.QUEUED
     queueFlush()
   }
 }

packages/runtime-vapor/src/renderEffect.ts

@@ -1,7 +1,9 @@
 import {
+  EffectFlags,
   type EffectScope,
   ReactiveEffect,
-  getCurrentScope,
+  pauseTracking,
+  resetTracking,
 } from '@vue/reactivity'
 import {
   type SchedulerJob,
@@ -17,24 +19,18 @@ import { invokeArrayFns } from '@vue/shared'
 
 class RenderEffect extends ReactiveEffect {
   i: VaporComponentInstance | null
-  scope: EffectScope | undefined
-  baseJob: SchedulerJob
-  postJob: SchedulerJob
+  job: SchedulerJob
+  updateJob: SchedulerJob
 
   constructor(public render: () => void) {
     super()
     const instance = currentInstance as VaporComponentInstance | null
-    const scope = getCurrentScope()
-    if (__DEV__ && !__TEST__ && !scope && !isVaporComponent(instance)) {
+    if (__DEV__ && !__TEST__ && !this.subs && !isVaporComponent(instance)) {
       warn('renderEffect called without active EffectScope or Vapor instance.')
     }
 
-    this.baseJob = () => {
-      if (this.dirty) {
-        this.run()
-      }
-    }
-    this.postJob = () => {
+    const job: SchedulerJob = super.scheduler.bind(this)
+    this.updateJob = () => {
       instance!.isUpdating = false
       instance!.u && invokeArrayFns(instance!.u)
     }
@@ -48,19 +44,29 @@ class RenderEffect extends ReactiveEffect {
           ? e => invokeArrayFns(instance.rtg!, e)
           : void 0
       }
-      this.baseJob.i = instance
-      this.baseJob.id = instance.uid
+      job.i = instance
+      job.id = instance.uid
     }
 
+    this.job = job
     this.i = instance
-    this.scope = scope
 
     // TODO recurse handling
   }
 
+  run(): void {
+    if (this.deps === undefined) {
+      super.run()
+    } else {
+      pauseTracking()
+      this.callback()
+      resetTracking()
+    }
+  }
+
   callback(): void {
     const instance = this.i!
-    const scope = this.scope
+    const scope = this.subs ? (this.subs.sub as EffectScope) : undefined
     // renderEffect is always called after user has registered all hooks
     const hasUpdateHooks = instance && (instance.bu || instance.u)
     if (__DEV__ && instance) {
@@ -73,7 +79,7 @@ class RenderEffect extends ReactiveEffect {
       instance.isUpdating = true
       instance.bu && invokeArrayFns(instance.bu)
       this.render()
-      queuePostFlushCb(this.postJob)
+      queuePostFlushCb(this.updateJob)
     } else {
       this.render()
     }
@@ -84,8 +90,13 @@ class RenderEffect extends ReactiveEffect {
     }
   }
 
-  scheduler(): void {
-    queueJob(this.baseJob)
+  notify(): void {
+    const flags = this.flags
+    if (!(flags & EffectFlags.PAUSED)) {
+      queueJob(this.job)
+    } else {
+      this.flags = flags | EffectFlags.NOTIFIED
+    }
   }
 }