perf(reactivity): skip type checks for cached proxies (#14860)

packages/reactivity/__benchmarks__/reactiveObject.bench.ts

@@ -5,6 +5,14 @@ bench('create reactive obj', () => {
   reactive({ a: 1 })
 })
 
+{
+  const raw = { a: 1 }
+  reactive(raw)
+  bench('return cached reactive obj', () => {
+    reactive(raw)
+  })
+}
+
 {
   const r = reactive({ a: 1 })
   bench('read reactive obj property', () => {
@@ -12,6 +20,13 @@ bench('create reactive obj', () => {
   })
 }
 
+{
+  const r = reactive({ a: { b: 1 } })
+  bench('read nested reactive obj property', () => {
+    r.a.b
+  })
+}
+
 {
   let i = 0
   const r = reactive({ a: 1 })

packages/reactivity/src/reactive.ts

@@ -55,12 +55,6 @@ function targetTypeMap(rawType: string) {
   }
 }
 
-function getTargetType(value: Target) {
-  return value[ReactiveFlags.SKIP] || !Object.isExtensible(value)
-    ? TargetType.INVALID
-    : targetTypeMap(toRawType(value))
-}
-
 // only unwrap nested ref
 export type UnwrapNestedRefs<T> = T extends Ref ? T : UnwrapRefSimple<T>
 
@@ -291,8 +285,7 @@ function createReactiveObject(
     return target
   }
   // only specific value types can be observed.
-  const targetType = getTargetType(target)
-  if (targetType === TargetType.INVALID) {
+  if (target[ReactiveFlags.SKIP] || !Object.isExtensible(target)) {
     return target
   }
   // target already has corresponding Proxy
@@ -300,6 +293,10 @@ function createReactiveObject(
   if (existingProxy) {
     return existingProxy
   }
+  const targetType = targetTypeMap(toRawType(target))
+  if (targetType === TargetType.INVALID) {
+    return target
+  }
   const proxy = new Proxy(
     target,
     targetType === TargetType.COLLECTION ? collectionHandlers : baseHandlers,