react-native-onyx 2.0.129 → 2.0.130

package/dist/useOnyx.js

@@ -42,15 +42,33 @@ const OnyxCache_1 = __importStar(require("./OnyxCache"));
 const OnyxConnectionManager_1 = __importDefault(require("./OnyxConnectionManager"));
 const OnyxUtils_1 = __importDefault(require("./OnyxUtils"));
 const GlobalSettings = __importStar(require("./GlobalSettings"));
-const useLiveRef_1 = __importDefault(require("./useLiveRef"));
 const usePrevious_1 = __importDefault(require("./usePrevious"));
 const metrics_1 = __importDefault(require("./metrics"));
 const Logger = __importStar(require("./Logger"));
 function useOnyx(key, options, dependencies = []) {
     const connectionRef = (0, react_1.useRef)(null);
     const previousKey = (0, usePrevious_1.default)(key);
-    // Used to stabilize the selector reference and avoid unnecessary calls to `getSnapshot()`.
-    const selectorRef = (0, useLiveRef_1.default)(options === null || options === void 0 ? void 0 : options.selector);
+    // Create memoized version of selector for performance
+    const memoizedSelector = (0, react_1.useMemo)(() => {
+        if (!(options === null || options === void 0 ? void 0 : options.selector))
+            return null;
+        let lastInput;
+        let lastOutput;
+        let hasComputed = false;
+        return (input) => {
+            // Always recompute when input changes
+            if (!hasComputed || lastInput !== input) {
+                const newOutput = options.selector(input);
+                // Deep equality mode: only update if output actually changed
+                if (!hasComputed || !(0, fast_equals_1.deepEqual)(lastOutput, newOutput)) {
+                    lastInput = input;
+                    lastOutput = newOutput;
+                    hasComputed = true;
+                }
+            }
+            return lastOutput;
+        };
+    }, [options === null || options === void 0 ? void 0 : options.selector]);
     // Stores the previous cached value as it's necessary to compare with the new value in `getSnapshot()`.
     // We initialize it to `null` to simulate that we don't have any value from cache yet.
     const previousValueRef = (0, react_1.useRef)(null);
@@ -120,7 +138,7 @@ function useOnyx(key, options, dependencies = []) {
         }
     }, [key, options === null || options === void 0 ? void 0 : options.canEvict]);
     const getSnapshot = (0, react_1.useCallback)(() => {
-        var _a, _b, _c;
+        var _a, _b, _c, _d;
         let isOnyxValueDefined = true;
         // We return the initial result right away during the first connection if `initWithStoredValues` is set to `false`.
         if (isFirstConnectionRef.current && (options === null || options === void 0 ? void 0 : options.initWithStoredValues) === false) {
@@ -132,7 +150,7 @@ function useOnyx(key, options, dependencies = []) {
         if (isFirstConnectionRef.current || shouldGetCachedValueRef.current) {
             // Gets the value from cache and maps it with selector. It changes `null` to `undefined` for `useOnyx` compatibility.
             const value = OnyxUtils_1.default.tryGetCachedValue(key);
-            const selectedValue = selectorRef.current ? selectorRef.current(value) : value;
+            const selectedValue = memoizedSelector ? memoizedSelector(value) : value;
             newValueRef.current = (selectedValue !== null && selectedValue !== void 0 ? selectedValue : undefined);
             // This flag is `false` when the original Onyx value (without selector) is not defined yet.
             // It will be used later to check if we need to log an alert that the value is missing.
@@ -151,15 +169,18 @@ function useOnyx(key, options, dependencies = []) {
             newValueRef.current = undefined;
             newFetchStatus = 'loading';
         }
-        // We do a deep equality check if `selector` is defined, since each `tryGetCachedValue()` call will
-        // generate a plain new primitive/object/array that was created using the `selector` function.
-        // For the other cases we will only deal with object reference checks, so just a shallow equality check is enough.
+        // Optimized equality checking - eliminated redundant deep equality:
+        // - Memoized selectors already handle deep equality internally, so we can use fast reference equality
+        // - Non-selector cases use shallow equality for object reference checks
+        // - Normalize null to undefined to ensure consistent comparison (both represent "no value")
         let areValuesEqual;
-        if (selectorRef.current) {
-            areValuesEqual = (0, fast_equals_1.deepEqual)((_a = previousValueRef.current) !== null && _a !== void 0 ? _a : undefined, newValueRef.current);
+        if (memoizedSelector) {
+            const normalizedPrevious = (_a = previousValueRef.current) !== null && _a !== void 0 ? _a : undefined;
+            const normalizedNew = (_b = newValueRef.current) !== null && _b !== void 0 ? _b : undefined;
+            areValuesEqual = normalizedPrevious === normalizedNew;
         }
         else {
-            areValuesEqual = (0, fast_equals_1.shallowEqual)((_b = previousValueRef.current) !== null && _b !== void 0 ? _b : undefined, newValueRef.current);
+            areValuesEqual = (0, fast_equals_1.shallowEqual)((_c = previousValueRef.current) !== null && _c !== void 0 ? _c : undefined, newValueRef.current);
         }
         // We update the cached value and the result in the following conditions:
         // We will update the cached value and the result in any of the following situations:
@@ -173,7 +194,7 @@ function useOnyx(key, options, dependencies = []) {
             // If the new value is `null` we default it to `undefined` to ensure the consumer gets a consistent result from the hook.
             const newStatus = newFetchStatus !== null && newFetchStatus !== void 0 ? newFetchStatus : 'loaded';
             resultRef.current = [
-                (_c = previousValueRef.current) !== null && _c !== void 0 ? _c : undefined,
+                (_d = previousValueRef.current) !== null && _d !== void 0 ? _d : undefined,
                 {
                     status: newStatus,
                     sourceValue: sourceValueRef.current,
@@ -187,7 +208,7 @@ function useOnyx(key, options, dependencies = []) {
             }
         }
         return resultRef.current;
-    }, [options === null || options === void 0 ? void 0 : options.initWithStoredValues, options === null || options === void 0 ? void 0 : options.allowStaleData, options === null || options === void 0 ? void 0 : options.canBeMissing, key, selectorRef]);
+    }, [options === null || options === void 0 ? void 0 : options.initWithStoredValues, options === null || options === void 0 ? void 0 : options.allowStaleData, options === null || options === void 0 ? void 0 : options.canBeMissing, key, memoizedSelector]);
     const subscribe = (0, react_1.useCallback)((onStoreChange) => {
         isConnectingRef.current = true;
         onStoreChangeFnRef.current = onStoreChange;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-onyx",
-  "version": "2.0.129",
+  "version": "2.0.130",
   "author": "Expensify, Inc.",
   "homepage": "https://expensify.com",
   "description": "State management for React Native",