refactor(overmind-react): improve hook work in production

Author: christianalfoni

packages/node_modules/overmind-react/src/index.ts

@@ -15,6 +15,8 @@ import {
 } from 'react'
 import { IMutation } from 'proxy-state-tree'
 
+const IS_PRODUCTION = process.env.NODE_ENV === 'production'
+
 export type IReactComponent<P = any> =
   | StatelessComponent<P>
   | ComponentClass<P>
@@ -66,48 +68,62 @@ export const createHook = <A extends Overmind<Configuration>>(
     const [tree, updateComponent] = useState<any>(() =>
       (overmind as any).proxyStateTree.getTrackStateTree()
     )
-    const [debugging] = useState<any>(() => ({
-      isFirstRender: true,
-      currentFlushId: 0,
-      componentInstanceId: currentComponentInstanceId++,
-    }))
-
-    tree.track((mutations, paths, flushId) => {
-      debugging.currentFlushId = flushId
-      updateComponent((state) => state)
-    })
-
-    useLayoutEffect(() => {
-      if (debugging.isFirstRender) {
-        overmind.eventHub.emitAsync(EventType.COMPONENT_ADD, {
-          componentId: component.__componentId,
-          componentInstanceId: debugging.componentInstanceId,
-          name,
-          paths: Array.from(tree.pathDependencies) as any,
-        })
-        debugging.isFirstRender = false
-      } else {
-        overmind.eventHub.emitAsync(EventType.COMPONENT_UPDATE, {
-          componentId: component.__componentId,
-          componentInstanceId: debugging.componentInstanceId,
-          name,
-          flushId: debugging.currentFlushId,
-          paths: Array.from(tree.pathDependencies as Set<string>),
-        })
-      }
-    })
 
-    useEffect(
-      () => () => {
-        ;(overmind as any).proxyStateTree.disposeTree(tree)
-        overmind.eventHub.emitAsync(EventType.COMPONENT_REMOVE, {
-          componentId: component.__componentId,
-          componentInstanceId: debugging.componentInstanceId,
-          name,
-        })
-      },
-      []
-    )
+    if (IS_PRODUCTION) {
+      tree.track(() => {
+        updateComponent((state) => state)
+      })
+
+      useEffect(
+        () => () => {
+          ;(overmind as any).proxyStateTree.disposeTree(tree)
+        },
+        []
+      )
+    } else {
+      const [debugging] = useState<any>(() => ({
+        isFirstRender: true,
+        currentFlushId: 0,
+        componentInstanceId: currentComponentInstanceId++,
+      }))
+
+      tree.track((mutations, paths, flushId) => {
+        debugging.currentFlushId = flushId
+        updateComponent((state) => state)
+      })
+
+      useLayoutEffect(() => {
+        if (debugging.isFirstRender) {
+          overmind.eventHub.emitAsync(EventType.COMPONENT_ADD, {
+            componentId: component.__componentId,
+            componentInstanceId: debugging.componentInstanceId,
+            name,
+            paths: Array.from(tree.pathDependencies) as any,
+          })
+          debugging.isFirstRender = false
+        } else {
+          overmind.eventHub.emitAsync(EventType.COMPONENT_UPDATE, {
+            componentId: component.__componentId,
+            componentInstanceId: debugging.componentInstanceId,
+            name,
+            flushId: debugging.currentFlushId,
+            paths: Array.from(tree.pathDependencies as Set<string>),
+          })
+        }
+      })
+
+      useEffect(
+        () => () => {
+          ;(overmind as any).proxyStateTree.disposeTree(tree)
+          overmind.eventHub.emitAsync(EventType.COMPONENT_REMOVE, {
+            componentId: component.__componentId,
+            componentInstanceId: debugging.componentInstanceId,
+            name,
+          })
+        },
+        []
+      )
+    }
 
     return {
       state: tree.state,