feat: chunk cache

Author: alexcambose

apps/insights/src/app/actions.ts

@@ -11,7 +11,6 @@ import { getStatus } from "../../status";
 import { PublisherIcon } from "../PublisherIcon";
 import { PublisherTag } from "../PublisherTag";
 import { PublishersCard } from "./publishers-card";
-import { funcA, funcAUnstableCache } from '../../app/actions';
 
 type Props = {
   params: Promise<{
@@ -20,24 +19,6 @@ type Props = {
 };
 
 
-const funcB = async () => {
-  const start = performance.now();
-  const res = await funcA();
-  const end = performance.now();
-  // eslint-disable-next-line no-console, @typescript-eslint/restrict-template-expressions
-  console.log(`funcB: ${end - start}ms`);
-  return res;
-}
-
-const funcBUnstableCache = async () => {
-  const start = performance.now();
-  const res = await funcAUnstableCache();
-  const end = performance.now();
-  // eslint-disable-next-line no-console, @typescript-eslint/restrict-template-expressions
-  console.log(`funcBUnstableCache: ${end - start}ms`);
-  return res;
-}
-
 export const Publishers = async ({ params }: Props) => {
   const { slug } = await params;
   const symbol = decodeURIComponent(slug);
@@ -46,19 +27,12 @@ export const Publishers = async ({ params }: Props) => {
     pythtestConformanceFeeds,
     pythnetPublishers,
     pythtestConformancePublishers,
-    funcRes,
-    funcResUnstableCache,
   ] = await Promise.all([
     getFeedsCached(Cluster.Pythnet),
     getFeedsCached(Cluster.PythtestConformance),
     getPublishers(Cluster.Pythnet, symbol),
     getPublishers(Cluster.PythtestConformance, symbol),
-    funcB(),
-    funcBUnstableCache(),
   ]);
-
-  // eslint-disable-next-line no-console, @typescript-eslint/restrict-template-expressions
-  console.log(funcRes, funcResUnstableCache);
   const feed = pythnetFeeds.find((feed) => feed.symbol === symbol);
   const testFeed = pythtestConformanceFeeds.find(
     (feed) => feed.symbol === symbol,

apps/insights/src/components/PriceFeed/publishers.tsx

@@ -1,112 +1,67 @@
-import { unstable_cache } from "next/cache";
 import { cache } from 'react';
-import superjson from "superjson";
-import { z } from "zod";
+import type { z } from 'zod';
 
-// Your imports
 import { Cluster, clients, priceFeedsSchema } from "../services/pyth";
+import { createChunkedCacheFetcher, fetchAllChunks } from '../utils/cache';
 
 const getDataCached = cache(async (cluster: Cluster) => {
   return clients[cluster].getData();
 });
-const MAX_CACHE_SIZE_STRING = 2 * 1024 * 1024 - 510_000; // is the buffer for the returned object and the metadata from next
 
-const getPublishersForFeed = unstable_cache(async (cluster: Cluster, chunk?: number) => {
+const fetchFeeds = createChunkedCacheFetcher(async (cluster: Cluster) => {
+  const unfilteredData = await getDataCached(cluster);
+  const filteredData = unfilteredData.symbols
+      .filter(
+        (symbol) =>
+          unfilteredData.productFromSymbol.get(symbol)?.display_symbol !== undefined
+      )
+      .map((symbol) => ({
+        symbol,
+        product: unfilteredData.productFromSymbol.get(symbol),
+        price: {
+          ...unfilteredData.productPrice.get(symbol),
+          priceComponents:
+            unfilteredData.productPrice
+              .get(symbol)
+              ?.priceComponents.map(({ publisher }) => ({
+                publisher: publisher.toBase58(),
+              })) ?? [],
+        },
+      }));
+  const parsedData = priceFeedsSchema.parse(filteredData);
+  return parsedData;
+}, 'getfeeds');
+
+
+const fetchPublishers = createChunkedCacheFetcher(async (cluster: Cluster) => {
   const data = await getDataCached(cluster);
   const result: Record<string, string[]> = {};
   for (const key of data.productPrice.keys()) {
     const price = data.productPrice.get(key);
     result[key] = price?.priceComponents.map(({ publisher }) => publisher.toBase58()) ?? [];
   }
-  const stringifiedResult = superjson.stringify(result);
-
-    const chunksNumber = Math.ceil(stringifiedResult.length / MAX_CACHE_SIZE_STRING);
-    const chunks = [];
-    for(let i = 0; i < chunksNumber; i++) {
-      chunks.push(stringifiedResult.slice(i * MAX_CACHE_SIZE_STRING, (i + 1) * MAX_CACHE_SIZE_STRING));
-    }
-  return {
-    chunk: chunks[chunk ?? 0],
-    chunksNumber,
-  };
-}, [], { revalidate: false });
-
-const _getFeeds = unstable_cache(async (cluster: Cluster, chunk?: number) => {
-  // eslint-disable-next-line no-console
-  console.log('getFeeds', cluster, chunk);
-  const data = await getDataCached(cluster);
-  const parsedData = priceFeedsSchema.parse(
-      data.symbols
-        .filter(
-          (symbol) =>
-            data.productFromSymbol.get(symbol)?.display_symbol !== undefined
-        )
-        .map((symbol) => ({
-          symbol,
-          product: data.productFromSymbol.get(symbol),
-          price: {
-            ...data.productPrice.get(symbol),
-            priceComponents:
-              data.productPrice
-                .get(symbol)
-                ?.priceComponents.map(({ publisher }) => ({
-                  publisher: publisher.toBase58(),
-                })) ?? [],
-          },
-        }))
-    )
-  const result = superjson.stringify(
-    parsedData
-  );
-  const chunksNumber = Math.ceil(result.length / MAX_CACHE_SIZE_STRING);
-  const chunks = [];
-  for(let i = 0; i < chunksNumber; i++) {
-    chunks.push(result.slice(i * MAX_CACHE_SIZE_STRING, (i + 1) * MAX_CACHE_SIZE_STRING));
-  }
-  return {
-    chunk: chunks[chunk ?? 0],
-    chunksNumber,
-  };
-}, [], { revalidate: false });
+  return result;
+}, 'getpublishers');
 
 export const getFeedsCached = async (cluster: Cluster) => {
-  const start = performance.now();
-  const { chunk, chunksNumber } = await _getFeeds(cluster); // uses cache
-  const rawResults = await Promise.all(Array.from({ length: chunksNumber-1 }, (_, i) => _getFeeds(cluster, i+1)));
-  const rawJson = [chunk, ...rawResults.map(({ chunk }) => chunk)].join('');
-  const data = superjson.parse<z.infer<typeof priceFeedsSchema>>(rawJson);
-  const end = performance.now();
-  // eslint-disable-next-line no-console, @typescript-eslint/restrict-template-expressions
-  console.log(`getFeedsCached: ${end - start}ms`);
-  return data;
+  return fetchAllChunks<z.infer<typeof priceFeedsSchema>, [Cluster]>(fetchFeeds,  cluster)
 };
 
 export const getPublishersForFeedCached = async (cluster: Cluster, symbol: string) => {
-  const start = performance.now();
-  const { chunk, chunksNumber } = await getPublishersForFeed(cluster); // uses cache
-  const rawResults = await Promise.all(Array.from({ length: chunksNumber-1 }, (_, i) => getPublishersForFeed(cluster, i+1)));
-  const rawJson = [chunk, ...rawResults.map(({ chunk }) => chunk)].join('');
-  const data = superjson.parse<Record<string, string[]>>(rawJson);
-  const end = performance.now();
-  // eslint-disable-next-line no-console, @typescript-eslint/restrict-template-expressions
-  console.log(`getPublishersForFeedCached: ${end - start}ms`);
-  return data[symbol];
+  const data = await fetchAllChunks<Record<string, string[]>, [Cluster]>(fetchPublishers, cluster);
+  return data[symbol]
 };
 
 export const getFeedsForPublisherCached = async (
   cluster: Cluster,
   publisher: string
 ) => {
-  const start = performance.now();
-  const data = await getFeedsCached(cluster); // uses cache
-  const end = performance.now();
-  // eslint-disable-next-line no-console, @typescript-eslint/restrict-template-expressions
-  console.log(`getFeedsForPublisherCached: ${end - start}ms.`);
+  const data = await getFeedsCached(cluster); 
   return priceFeedsSchema.parse(
     data.filter(({ price }) =>
       price.priceComponents.some(
         (component) => component.publisher.toString() === publisher
       )
     )
   );
-};
+};

apps/insights/src/server/pyth.ts

@@ -1,7 +1,9 @@
 import { unstable_cache } from "next/cache";
 import superjson from "superjson";
 
-const MAX_CACHE_SIZE_STRING = 2 * 1024 * 1024 - 510_000; // your buffer size
+const MAX_CACHE_SIZE_STRING = 2 * 1024 * 1024 - 510_000; // buffer size, subtracted some of the nextjs overhead added to each cache entry
+const REVALIDATE_TIME = 60 * 60 * 24; // 24 hours
+
 
 type ChunkedCacheResult = {
   chunk: string;
@@ -17,9 +19,9 @@ type CacheFetcher<Args extends unknown[]> = (...args: [...Args, number?]) => Pro
  * @returns a new async function that fetches chunked cached data with the same args plus optional chunk number
  */
 export function createChunkedCacheFetcher<T, Args extends unknown[]>(
-  fetchFullData: (...args: Args) => Promise<T>
+  fetchFullData: (...args: Args) => Promise<T>,
+  key: string,
 ): CacheFetcher<Args> {
-  // chunk number default 0 = first chunk
   return unstable_cache(
     async (...argsWithChunk: [...Args, number?]) => {
       const [args, chunk] = (() => {
@@ -29,8 +31,6 @@ export function createChunkedCacheFetcher<T, Args extends unknown[]>(
         return [argsWithChunk.slice(0, -1) as Args, argsWithChunk.at(-1) ?? 0] as [Args, number];
       })();
 
-      // Fetch fresh full data and serialize it
-      // Could memoize inside this function but using Next's cache instead
       const fullData = await fetchFullData(...args);
       const serialized = superjson.stringify(fullData);
 
@@ -48,8 +48,8 @@ export function createChunkedCacheFetcher<T, Args extends unknown[]>(
         chunksNumber,
       };
     },
-    [],
-    { revalidate: false }
+    [key],
+    { revalidate: REVALIDATE_TIME }
   );
 }
 
@@ -67,13 +67,11 @@ export async function fetchAllChunks<T, Args extends unknown[]>(
   if (chunksNumber <= 1) {
     return superjson.parse(firstChunkData.chunk);
   }
-
   const otherChunks = await Promise.all(
     Array.from({ length: chunksNumber - 1 }, (_, i) => fetcher(...args, i + 1))
   );
 
   const fullString =
     firstChunkData.chunk + otherChunks.map(({ chunk }) => chunk).join("");
-
   return superjson.parse(fullString);
 }