refactor(reactivity): optimize stop method in ReactiveEffect and EffectScope

Author: johnsoncodehk

packages/reactivity/src/effect.ts

@@ -149,14 +149,14 @@ export class ReactiveEffect<T = any>
   }
 
   stop(): void {
-    const sub = this.subs
-    if (sub !== undefined) {
-      unlink(sub)
-    }
     let dep = this.deps
     while (dep !== undefined) {
       dep = unlink(dep, this)
     }
+    const sub = this.subs
+    if (sub !== undefined) {
+      unlink(sub)
+    }
     this.flags = 0
     cleanup(this)
   }

packages/reactivity/src/effectScope.ts

@@ -69,14 +69,20 @@ export class EffectScope implements ReactiveNode {
   }
 
   stop(): void {
+    let dep = this.deps
+    while (dep !== undefined) {
+      const node = dep.dep
+      if ('stop' in node) {
+        dep = dep.nextDep
+        node.stop()
+      } else {
+        dep = unlink(dep, this)
+      }
+    }
     const sub = this.subs
     if (sub !== undefined) {
       unlink(sub)
     }
-    let dep = this.deps
-    while (dep !== undefined) {
-      dep = unlink(dep, this)
-    }
     this.flags = 0
     cleanup(this)
   }

packages/reactivity/src/system.ts

@@ -128,12 +128,10 @@ export function unlink(
     prevSub.nextSub = nextSub
   } else if ((dep.subs = nextSub) === undefined) {
     let toRemove = dep.deps
-    while (toRemove !== undefined) {
-      toRemove = unlink(toRemove, dep)
-    }
-    if ('stop' in dep) {
-      dep.stop()
-    } else {
+    if (toRemove !== undefined) {
+      do {
+        toRemove = unlink(toRemove, dep)
+      } while (toRemove !== undefined)
       dep.flags |= ReactiveFlags.Dirty
     }
   }