feat(useMemoCache): useMemo with cache

src/useMemoCache/__tests__/dom.ts

@@ -205,5 +205,33 @@ describe('useMemoCache', () => {
       expect(cachedValue2).toBe(value);
       expect(memoCache.isNone(cachedValue1)).toBeFalsy();
     });
+
+    it('cache should have max 64 entries', () => {
+      const memoCache = createMemoCache();
+
+      // eslint-disable-next-line symbol-description
+      const firstItem = Symbol();
+
+      const MAX_ENTRIES = 64;
+      let indexCounter = 0;
+
+      while (indexCounter !== MAX_ENTRIES) {
+        indexCounter++;
+
+        if (indexCounter === 1) {
+          memoCache.set([indexCounter], firstItem);
+        } else {
+          memoCache.set([indexCounter], null);
+        }
+      }
+
+      const state1 = memoCache.get([1]);
+      expect(state1).toBe(firstItem);
+
+      memoCache.set([indexCounter + 1], null);
+
+      const state2 = memoCache.get([1]);
+      expect(memoCache.isNone(state2)).toBeTruthy();
+    });
   });
 });

src/useMemoCache/index.ts

@@ -14,7 +14,10 @@ type CachedItem<State> = { state: State; dependencyList: DependencyList };
 export const createMemoCache = <State>(
   customAreHookInputsEqual?: typeof nativeAreHookInputsEqual
 ) => {
-  const cache = new Set<CachedItem<State>>();
+  const MAX_ENTRIES = 64;
+  let indexCounter = 0;
+
+  const cache = new Map<number, CachedItem<State>>();
   const areHookInputsEqual = customAreHookInputsEqual ?? nativeAreHookInputsEqual;
 
   const get = (dependencyList: DependencyList) => {
@@ -34,8 +37,14 @@ export const createMemoCache = <State>(
       areHookInputsEqual(item.dependencyList, dependencyList)
     );
 
+    indexCounter++;
+
     if (canAddToItem) {
-      cache.add({ dependencyList, state });
+      cache.set(indexCounter, { dependencyList, state });
+    }
+
+    if (canAddToItem && indexCounter > MAX_ENTRIES) {
+      cache.delete(indexCounter - MAX_ENTRIES);
     }
   };