Refactor Component

packages/effect-fc-next/src/Component.ts

@@ -83,16 +83,26 @@ const use = Effect.fnUntraced(function* <P extends {}, A extends React.ReactNode
     const contextRef = React.useRef<Context.Context<Exclude<R, Scope.Scope>>>(null!)
     contextRef.current = yield* Effect.context<Exclude<R, Scope.Scope>>()
 
-    return yield* React.useState(() => Effect.runSyncWith(contextRef.current)(Effect.cachedFunction(
-        (_services: readonly any[]) => Effect.sync(() => {
-            const f = self.asFunctionComponent(contextRef)
-            self.setFunctionComponentName(f)
-            return self.transformFunctionComponent(f)
-        }),
-        Equivalence.array(Equivalence.strictEqual()),
-    )))[0](Array.from(
+    const componentRef = React.useRef<F | null>(null)
+    const previousServicesRef = React.useRef<readonly any[] | null>(null)
+
+    const services = Array.from(
         Context.omit(...self.nonReactiveTags)(contextRef.current).mapUnsafe.values()
-    ))
+    )
+
+    if (
+        !componentRef.current ||
+        !previousServicesRef.current ||
+        services.length !== previousServicesRef.current.length ||
+        !Equivalence.Array(Equivalence.strictEqual())(services, previousServicesRef.current)
+    ) {
+        previousServicesRef.current = services
+        const f = self.asFunctionComponent(contextRef)
+        self.setFunctionComponentName(f)
+        componentRef.current = self.transformFunctionComponent(f)
+    }
+
+    return componentRef.current
 })