Teact: do not record hit rate by default, getUnequalProps → logUnequalProps

src/lib/teact/teact.ts

@@ -4,7 +4,7 @@ import { requestMeasure, requestMutation } from '../fasterdom/fasterdom';
 import { DEBUG, DEBUG_MORE } from '../../config';
 import { throttleWith } from '../../util/schedulers';
 import { orderBy } from '../../util/iteratees';
-import { getUnequalProps } from '../../util/arePropsShallowEqual';
+import { logUnequalProps } from '../../util/arePropsShallowEqual';
 import { incrementOverlayCounter } from '../../util/debugOverlay';
 import { isSignal } from '../../util/signals';
 import safeExec from '../../util/safeExec';
@@ -807,6 +807,16 @@ export function useMemo<T extends any>(
     || dependencies.some((dependency, i) => dependency !== byCursor[cursor].dependencies[i])
   ) {
     if (DEBUG) {
+      if (debugKey) {
+        const msg = `[Teact.useMemo] ${renderingInstance.name} (${debugKey}): Update is caused by:`;
+        if (!byCursor[cursor]) {
+          // eslint-disable-next-line no-console
+          console.log(`${msg} [first render]`);
+        } else {
+          logUnequalProps(byCursor[cursor].dependencies, dependencies, msg, debugKey);
+        }
+      }
+
       if (DEBUG_state) {
         DEBUG_state.misses++;
         DEBUG_state.hitRate = (DEBUG_state.calls - DEBUG_state.misses) / DEBUG_state.calls;
@@ -823,16 +833,6 @@ export function useMemo<T extends any>(
           );
         }
       }
-
-      if (debugKey) {
-        // eslint-disable-next-line no-console
-        console.log(
-          `[Teact.useMemo] ${renderingInstance.name} (${debugKey}): Update is caused by:`,
-          byCursor[cursor]
-            ? getUnequalProps(byCursor[cursor].dependencies, dependencies).join(', ')
-            : '[first render]',
-        );
-      }
     }
 
     value = resolver();
@@ -877,7 +877,7 @@ export function memo<T extends FC_withDebug>(Component: T, debugKey?: string) {
       // eslint-disable-next-line react-hooks-static-deps/exhaustive-deps
       Object.values(props),
       debugKey,
-      DEBUG_resolveComponentName(renderingInstance.Component),
+      DEBUG_MORE ? DEBUG_resolveComponentName(renderingInstance.Component) : undefined,
     );
   }
 

src/lib/teact/teactn.tsx

@@ -5,7 +5,7 @@ import { requestMeasure } from '../fasterdom/fasterdom';
 
 import { DEBUG, DEBUG_MORE } from '../../config';
 import { throttleWithTickEnd } from '../../util/schedulers';
-import arePropsShallowEqual, { getUnequalProps } from '../../util/arePropsShallowEqual';
+import arePropsShallowEqual, { logUnequalProps } from '../../util/arePropsShallowEqual';
 import { orderBy } from '../../util/iteratees';
 import { handleError } from '../../util/handleError';
 
@@ -198,12 +198,10 @@ function updateContainers() {
 
     if (Object.keys(newMappedProps).length && !arePropsShallowEqual(mappedProps!, newMappedProps)) {
       if (DEBUG_MORE) {
-        // eslint-disable-next-line no-console
+        logUnequalProps(
-        console.log(
+          mappedProps!,
-          '[TeactN] Will update',
+          newMappedProps,
-          container.DEBUG_componentName,
+          `[TeactN] Will update ${container.DEBUG_componentName} caused by:`,
-          'caused by',
-          getUnequalProps(mappedProps!, newMappedProps).join(', '),
         );
       }
 

src/util/arePropsShallowEqual.ts

@@ -25,20 +25,23 @@ export default function arePropsShallowEqual(currentProps: AnyLiteral, newProps:
   return true;
 }
 
-export function getUnequalProps(currentProps: AnyLiteral, newProps: AnyLiteral) {
+export function logUnequalProps(currentProps: AnyLiteral, newProps: AnyLiteral, msg: string, debugKey = '') {
   const currentKeys = Object.keys(currentProps);
   const currentKeysLength = currentKeys.length;
   const newKeysLength = Object.keys(newProps).length;
 
   if (currentKeysLength !== newKeysLength) {
-    return ['%LENGTH%'];
+    // eslint-disable-next-line no-console
+    console.log(`${msg} LENGTH`);
+    return;
   }
 
-  return currentKeys.reduce((res, prop) => {
+  // eslint-disable-next-line no-console
+  console.log(msg);
+  currentKeys.forEach((res, prop) => {
     if (currentProps[prop] !== newProps[prop]) {
-      res.push(`${prop}: ${currentProps[prop]} => ${newProps[prop]}`);
+      // eslint-disable-next-line no-console
+      console.log(debugKey, prop, ':', currentProps[prop], '=>', newProps[prop]);
     }
-
+  });
-    return res;
-  }, [] as string[]);
 }