perf(vapor): optimize cache property lookup

diff --git a/packages/runtime-vapor/src/apiCreateApp.ts b/packages/runtime-vapor/src/apiCreateApp.ts
index 9c77279ac467a2a6fa614ae87689c0a5c469538a..8088e1aee6d49f4cae7989723575242e9027867d 100644 (file)
--- a/packages/runtime-vapor/src/apiCreateApp.ts
+++ b/packages/runtime-vapor/src/apiCreateApp.ts
@@ -19,10 +19,13 @@ import {
 } from '@vue/runtime-dom'
 import type { RawProps } from './componentProps'
 import { getGlobalThis } from '@vue/shared'
+import { optimizePropertyLookup } from './dom/prop'
 
 let _createApp: CreateAppFunction<ParentNode, VaporComponent>
 
 const mountApp: AppMountFn<ParentNode> = (app, container) => {
+  optimizePropertyLookup()
+
   // clear content before mounting
   if (container.nodeType === 1 /* Node.ELEMENT_NODE */) {
     container.textContent = ''

diff --git a/packages/runtime-vapor/src/dom/prop.ts b/packages/runtime-vapor/src/dom/prop.ts
index aae3948de643f33498acffd25038d95bea6111d3..137f2d807f0ea8983d68df86a0a479e4ac199a93 100644 (file)
--- a/packages/runtime-vapor/src/dom/prop.ts
+++ b/packages/runtime-vapor/src/dom/prop.ts
@@ -244,3 +244,22 @@ export function setDynamicProp(
   }
   return value
 }
+
+let isOptimized = false
+
+/**
+ * Optimize property lookup for cache properties on Element and Text nodes
+ */
+export function optimizePropertyLookup(): void {
+  if (isOptimized) return
+  isOptimized = true
+  const proto = Element.prototype as any
+  proto.$evtclick = undefined
+  proto.$root = false
+  proto.$html =
+    proto.$txt =
+    proto.$cls =
+    proto.$sty =
+    (Text.prototype as any).$txt =
+      ''
+}

diff --git a/packages/runtime-vapor/src/vdomInterop.ts b/packages/runtime-vapor/src/vdomInterop.ts
index 68cb00956f1e2b27df64f2718a65ab0e035ca5cc..77228fd72a02fe85a5496daf7d89bc37e197a4d2 100644 (file)
--- a/packages/runtime-vapor/src/vdomInterop.ts
+++ b/packages/runtime-vapor/src/vdomInterop.ts
@@ -1,4 +1,5 @@
 import {
+  type App,
   type ComponentInternalInstance,
   type ConcreteComponent,
   MoveType,
@@ -31,6 +32,7 @@ import { type RawProps, rawPropsProxyHandlers } from './componentProps'
 import type { RawSlots, VaporSlot } from './componentSlots'
 import { renderEffect } from './renderEffect'
 import { createTextNode } from './dom/node'
+import { optimizePropertyLookup } from './dom/prop'
 
 // mounting vapor components and slots in vdom
 const vaporInteropImpl: Omit<
@@ -283,4 +285,9 @@ export const vaporInteropPlugin: Plugin = app => {
     vdomUnmount: internals.umt,
     vdomSlot: renderVDOMSlot.bind(null, internals),
   })
+  const mount = app.mount
+  app.mount = ((...args) => {
+    optimizePropertyLookup()
+    return mount(...args)
+  }) satisfies App['mount']
 }