perf(reactivity): add fast path for notify a single effect

Author: johnsoncodehk

packages/reactivity/src/computed.ts

@@ -17,7 +17,7 @@ import {
   checkDirty,
   endTracking,
   link,
-  processComputedUpdate,
+  shallowPropagate,
   startTracking,
 } from './system'
 import { warn } from './warning'
@@ -138,8 +138,18 @@ export class ComputedRefImpl<T = any> implements Dependency, Subscriber {
 
   get value(): T {
     const flags = this.flags
-    if (flags & (SubscriberFlags.Dirty | SubscriberFlags.Pending)) {
-      processComputedUpdate(this, flags)
+    if (
+      flags & SubscriberFlags.Dirty ||
+      (flags & SubscriberFlags.Pending && checkDirty(this.deps!))
+    ) {
+      if (this.update()) {
+        const subs = this.subs
+        if (subs !== undefined) {
+          shallowPropagate(subs)
+        }
+      }
+    } else if (flags & SubscriberFlags.Pending) {
+      this.flags = flags & ~SubscriberFlags.Pending
     }
     if (activeSub !== undefined) {
       if (__DEV__) {

packages/reactivity/src/system.ts

@@ -47,7 +47,7 @@ export function startBatch(): void {
 }
 
 export function endBatch(): void {
-  if (!--batchDepth) {
+  if (!--batchDepth && notifyBufferLength) {
     processEffectNotifications()
   }
 }
@@ -180,7 +180,11 @@ export function propagate(current: Link): void {
 
     if (shouldNotify) {
       if ('notify' in sub) {
-        notifyBuffer[notifyBufferLength++] = sub
+        if (!batchDepth && !notifyBufferLength && next === undefined) {
+          sub.notify()
+        } else {
+          notifyBuffer[notifyBufferLength++] = sub
+        }
       } else {
         const subSubs = (sub as Dependency).subs
         if (subSubs !== undefined) {
@@ -225,7 +229,7 @@ export function propagate(current: Link): void {
     break
   } while (true)
 
-  if (!batchDepth) {
+  if (!batchDepth && notifyBufferLength) {
     processEffectNotifications()
   }
 }
@@ -251,22 +255,6 @@ export function endTracking(sub: Subscriber): void {
   sub.flags &= ~SubscriberFlags.Tracking
 }
 
-export function processComputedUpdate(
-  computed: Computed,
-  flags: SubscriberFlags,
-): void {
-  if (flags & SubscriberFlags.Dirty || checkDirty(computed.deps!)) {
-    if (computed.update()) {
-      const subs = computed.subs
-      if (subs !== undefined) {
-        shallowPropagate(subs)
-      }
-    }
-  } else {
-    computed.flags = flags & ~SubscriberFlags.Pending
-  }
-}
-
 export function processEffectNotifications(): void {
   while (notifyIndex < notifyBufferLength) {
     const effect = notifyBuffer[notifyIndex]!
@@ -348,7 +336,7 @@ export function checkDirty(current: Link): boolean {
   } while (true)
 }
 
-function shallowPropagate(link: Link): void {
+export function shallowPropagate(link: Link): void {
   do {
     const sub = link.sub
     const subFlags = sub.flags