perf(runtime): clear container on unmount

diff --git a/packages/runtime-vapor/src/apiCreateVaporApp.ts b/packages/runtime-vapor/src/apiCreateVaporApp.ts
index c4d547de29ad291586e8909a698af3eb94c613df..dd9fef347b16d25a6c4cd8927a07a7160199c444 100644 (file)
--- a/packages/runtime-vapor/src/apiCreateVaporApp.ts
+++ b/packages/runtime-vapor/src/apiCreateVaporApp.ts
@@ -109,17 +109,23 @@ export function createVaporApp(
       return app
     },
 
-    mount(rootContainer): any {
+    mount(container): any {
       if (!instance) {
-        rootContainer = normalizeContainer(rootContainer)
+        container = normalizeContainer(container)
         // #5571
-        if (__DEV__ && (rootContainer as any).__vue_app__) {
+        if (__DEV__ && (container as any).__vue_app__) {
           warn(
             `There is already an app instance mounted on the host container.\n` +
               ` If you want to mount another app on the same host container,` +
               ` you need to unmount the previous app by calling \`app.unmount()\` first.`,
           )
         }
+
+        // clear content before mounting
+        if (container.nodeType === 1 /* Node.ELEMENT_NODE */) {
+          container.textContent = ''
+        }
+
         instance = createComponentInstance(
           rootComponent,
           rootProps,
@@ -128,17 +134,22 @@ export function createVaporApp(
           context,
         )
         setupComponent(instance)
-        render(instance, rootContainer)
+        render(instance, container)
 
-        app._container = rootContainer
+        app._container = container
         // for devtools and telemetry
-        ;(rootContainer as any).__vue_app__ = app
+        ;(container as any).__vue_app__ = app
 
         if (__DEV__ || __FEATURE_PROD_DEVTOOLS__) {
           app._instance = instance
           devtoolsInitApp(app, version)
         }
 
+        if (container instanceof Element) {
+          container.removeAttribute('v-cloak')
+          container.setAttribute('data-v-app', '')
+        }
+
         return instance
       } else if (__DEV__) {
         warn(

diff --git a/packages/runtime-vapor/src/apiRender.ts b/packages/runtime-vapor/src/apiRender.ts
index d828c37022986fec770e6a5c0779b360bb4b1207..db4eed5339da45e9807d78b34ee09a80ee6667bd 100644 (file)
--- a/packages/runtime-vapor/src/apiRender.ts
+++ b/packages/runtime-vapor/src/apiRender.ts
@@ -5,7 +5,7 @@ import {
   setCurrentInstance,
   validateComponentName,
 } from './component'
-import { insert, querySelector, remove } from './dom/element'
+import { insert, querySelector } from './dom/element'
 import { flushPostFlushCbs, queuePostFlushCb } from './scheduler'
 import { invokeLifecycle } from './componentLifecycle'
 import { VaporLifecycleHooks } from './enums'
@@ -153,13 +153,13 @@ function mountComponent(
 }
 
 export function unmountComponent(instance: ComponentInternalInstance): void {
-  const { container, block, scope } = instance
+  const { container, scope } = instance
 
   // hook: beforeUnmount
   invokeLifecycle(instance, VaporLifecycleHooks.BEFORE_UNMOUNT, 'beforeUnmount')
 
   scope.stop()
-  block && remove(block, container)
+  container.textContent = ''
 
   // hook: unmounted
   invokeLifecycle(