feat: 依赖进行缓存，提高性能

example/main.tsx

@@ -69,5 +69,17 @@ class Home1 extends Home {
   }
 }
 
-const app = createApp(Home1)
+class App extends VueComponent {
+  render() {
+    return (
+      <>
+        <Home1></Home1>
+        <Home1></Home1>
+        <Home1></Home1>
+      </>
+    )
+  }
+}
+
+const app = createApp(App)
 app.mount('#app')

package.json

@@ -25,7 +25,7 @@
     "docs:dev": "vitepress dev docs",
     "docs:build": "vitepress build docs",
     "docs:serve": "vitepress serve docs",
-    "test": "vitest",
+    "test": "vitest --ui",
     "coverage": "vitest --coverage"
   },
   "files": [
@@ -64,6 +64,7 @@
     "@typescript-eslint/eslint-plugin": "^5.9.1",
     "@typescript-eslint/parser": "^5.9.1",
     "@vitejs/plugin-vue": "^2.0.1",
+    "@vitest/ui": "^0.1.19",
     "@vue/test-utils": "^2.0.0-rc.18",
     "@vue3-oop/plugin-vue-jsx": "^1.4.0",
     "ant-design-vue": "^3.0.0-alpha.11",

src/di/index.ts

@@ -4,6 +4,7 @@ import {
   InjectionToken,
   Provider,
   ReflectiveInjector,
+  ResolvedReflectiveProvider,
   SkipSelf,
   TypeProvider,
 } from 'injection-js'
@@ -13,6 +14,7 @@ import { createSymbol } from '../helper'
 export const InjectorKey: InjectionKey<ReflectiveInjector> = createSymbol('VUE3-OOP_ReflectiveInjector') as symbol
 
 const MetadataKey = createSymbol('VUE3-OOP_Component')
+const MetadataProviderKey = createSymbol('VUE3-OOP_ResolveProviders')
 
 declare module 'vue' {
   interface App {
@@ -38,6 +40,11 @@ export interface ComponentOptions {
    * 此注入器是否作为全局的store
    */
   globalStore?: boolean
+  /**
+   * option是否是稳定的，
+   * 依赖解析只会在第一次的时候解析并且缓存下来，所以options如果是动态变化的，请标记
+   */
+  stable?: boolean
 }
 
 export function Component(options?: ComponentOptions): ClassDecorator {
@@ -51,21 +58,26 @@ export function resolveComponent(target: { new (...args: []): any }) {
   // 如果没有使用 injection-js 则不创建注入器
   if (!Reflect.getMetadata('annotations', target)) return new target()
   const parent = inject(InjectorKey, undefined)
+  let resolveProviders = Reflect.getOwnMetadata<ResolvedReflectiveProvider[]>(MetadataProviderKey, target)
   const options: ComponentOptions | undefined = Reflect.getOwnMetadata(MetadataKey, target)
-  // 依赖
-  let deps: Provider[] = [target]
-  if (options?.providers?.length) {
-    deps = deps.concat(options.providers)
-  }
-  // 自动解析依赖的依赖
-  if (options?.autoResolveDeps !== false) {
-    deps = resolveDependencies(deps)
-  }
-  // 排除掉某些依赖
-  if (options?.exclude?.length) {
-    deps = deps.filter((k) => !options.exclude?.includes(k))
+  if (!resolveProviders || options?.stable === false) {
+    // 依赖
+    let deps: Provider[] = [target]
+    if (options?.providers?.length) {
+      deps = deps.concat(options.providers)
+    }
+    // 自动解析依赖的依赖
+    if (options?.autoResolveDeps !== false) {
+      deps = resolveDependencies(deps)
+    }
+    // 排除掉某些依赖
+    if (options?.exclude?.length) {
+      deps = deps.filter((k) => !options.exclude?.includes(k))
+    }
+    resolveProviders = ReflectiveInjector.resolve(deps)
+    // 缓存解析过的依赖, 提高性能
+    Reflect.defineMetadata(MetadataProviderKey, resolveProviders, target)
   }
-  const resolveProviders = ReflectiveInjector.resolve(deps)
   const injector = ReflectiveInjector.fromResolvedProviders(resolveProviders, parent)
   if (options?.globalStore) {
     // 如果作为全局的服务，则注入到根上面