chore: minor update

Author: edison1105

packages/runtime-core/src/component.ts

@@ -506,12 +506,20 @@ export interface ComponentInternalInstance {
    */
   asyncResolved: boolean
 
-  keepAliveEffect: Function[]
+  /**
+   * keep-alive instance
+   * @internal
+   */
+  keepAlive?: ComponentInternalInstance
+  /**
+   * effects when the component is activated in keep-alive
+   * @internal
+   */
+  activateEffects?: Function[]
 
   // lifecycle
   isMounted: boolean
   isUnmounted: boolean
-  isActivated: boolean
   isDeactivated: boolean
   /**
    * @internal
@@ -672,13 +680,10 @@ export function createComponentInstance(
     asyncDep: null,
     asyncResolved: false,
 
-    keepAliveEffect: [],
-
     // lifecycle hooks
     // not using enums here because it results in computed properties
     isMounted: false,
     isUnmounted: false,
-    isActivated: false,
     isDeactivated: false,
     bc: null,
     c: null,

packages/runtime-core/src/components/KeepAlive.ts

@@ -137,7 +137,6 @@ const KeepAliveImpl: ComponentOptions = {
       optimized,
     ) => {
       const instance = vnode.component!
-      instance.isActivated = false
       move(vnode, container, anchor, MoveType.ENTER, parentSuspense)
       // in case props have changed
       patch(
@@ -152,9 +151,11 @@ const KeepAliveImpl: ComponentOptions = {
         optimized,
       )
 
-      const effects = instance.keepAliveEffect
-      queuePostFlushCb(effects)
-      instance.keepAliveEffect.length = 0
+      const effects = instance.activateEffects
+      if (effects) {
+        queuePostFlushCb(effects)
+        instance.activateEffects!.length = 0
+      }
 
       queuePostRenderEffect(() => {
         instance.isDeactivated = false
@@ -174,26 +175,26 @@ const KeepAliveImpl: ComponentOptions = {
     }
 
     sharedContext.deactivate = (vnode: VNode) => {
-      const instance = vnode.component!
-      instance.isActivated = true
-      invalidateMount(instance.m)
-      invalidateMount(instance.a)
+      const i = vnode.component!
+      i.keepAlive = instance
+      invalidateMount(i.m)
+      invalidateMount(i.a)
 
       move(vnode, storageContainer, null, MoveType.LEAVE, parentSuspense)
       queuePostRenderEffect(() => {
-        if (instance.da) {
-          invokeArrayFns(instance.da)
+        if (i.da) {
+          invokeArrayFns(i.da)
         }
         const vnodeHook = vnode.props && vnode.props.onVnodeUnmounted
         if (vnodeHook) {
-          invokeVNodeHook(vnodeHook, instance.parent, vnode)
+          invokeVNodeHook(vnodeHook, i.parent, vnode)
         }
-        instance.isDeactivated = true
+        i.isDeactivated = true
       }, parentSuspense)
 
       if (__DEV__ || __FEATURE_PROD_DEVTOOLS__) {
         // Update components tree
-        devtoolsComponentAdded(instance)
+        devtoolsComponentAdded(i)
       }
     }
 

packages/runtime-core/src/renderer.ts

@@ -1429,15 +1429,18 @@ function baseCreateRenderer(
         // #2458: deference mount-only object parameters to prevent memleaks
         initialVNode = container = anchor = null as any
       } else {
-        let { next, bu, u, parent, vnode } = instance
+        let { next, bu, u, parent, vnode, keepAlive } = instance
 
-        const keepAliveParent = locateDeactiveKeepAlive(instance)
-        if (keepAliveParent) {
-          keepAliveParent.keepAliveEffect.push(() => {
-            if (!instance.isUnmounted) {
-              componentUpdateFn()
-            }
-          })
+        // skip unnecessary update while parent KeepAlive is deactivated.
+        // the update will be stored and applied once KeepAlive reactivates.
+        if (keepAlive) {
+          ;(keepAlive.activateEffects || (keepAlive.activateEffects = [])).push(
+            () => {
+              if (!instance.isUnmounted) {
+                componentUpdateFn()
+              }
+            },
+          )
           return
         }
 
@@ -2552,19 +2555,6 @@ function locateNonHydratedAsyncRoot(
   }
 }
 
-function locateDeactiveKeepAlive(instance: ComponentInternalInstance | null) {
-  while (instance) {
-    if (instance.isActivated) {
-      return instance
-    }
-    if (isKeepAlive(instance.vnode)) {
-      break
-    }
-    instance = instance.parent
-  }
-  return null
-}
-
 export function invalidateMount(hooks: LifecycleHook): void {
   if (hooks) {
     for (let i = 0; i < hooks.length; i++)