Improves caching and pre-rendering

Author: AyronK

examples/redis-minimal/src/app/manifest.ts

@@ -0,0 +1,20 @@
+import type { MetadataRoute } from "next";
+
+export default function manifest(): MetadataRoute.Manifest {
+  return {
+    name: "Next.js App",
+    short_name: "Next.js App",
+    description: "Next.js App",
+    start_url: "/",
+    display: "standalone",
+    background_color: "#fff",
+    theme_color: "#fff",
+    icons: [
+      {
+        src: "/favicon.ico",
+        sizes: "any",
+        type: "image/x-icon",
+      },
+    ],
+  };
+}

examples/redis-minimal/src/app/ppr-example/page.tsx

@@ -9,6 +9,8 @@ export default function Page({
   return (
     <section>
       <h1>This will be prerendered</h1>
+      <hr />
+      <h1>This will be dynamic</h1>
       <Suspense fallback={<Skeleton />}>
         <Example searchParams={searchParams} />
       </Suspense>
@@ -17,3 +19,5 @@ export default function Page({
 }
 
 export const experimental_ppr = true;
+
+export const revalidate = 3600;

packages/nextjs-cache-handler/src/handlers/cache-handler.ts

@@ -660,13 +660,6 @@ export class CacheHandler implements NextCacheHandler {
         implicitTags: softTags ?? [],
       });
 
-    if (cachedData?.value?.kind === "APP_ROUTE") {
-      cachedData.value.body = Buffer.from(
-        cachedData.value.body.toString(),
-        "base64",
-      );
-    }
-
     if (!cachedData && CacheHandler.#fallbackFalseRoutes.has(cacheKey)) {
       cachedData = await CacheHandler.#readPagesRouterPage(cacheKey);
 
@@ -734,18 +727,6 @@ export class CacheHandler implements NextCacheHandler {
         cacheHandlerValueTags = getTagsFromHeaders(value.headers ?? {});
         break;
       }
-      case "APP_ROUTE": {
-        // create a new object to avoid mutating the original value
-        value = {
-          // replace the body with a base64 encoded string to save space
-          body: value.body.toString("base64") as unknown as Buffer,
-          headers: value.headers,
-          kind: value.kind,
-          status: value.status,
-        };
-
-        break;
-      }
       default: {
         break;
       }

packages/nextjs-cache-handler/src/helpers/buffer.ts

@@ -14,9 +14,7 @@ export function parseBuffersToStrings(cacheHandlerValue: CacheHandlerValue) {
     return;
   }
 
-  const value: IncrementalCacheValue | null = {
-    ...cacheHandlerValue.value,
-  };
+  const value: IncrementalCacheValue | null = cacheHandlerValue.value;
 
   const kind = value?.kind;
 
@@ -27,7 +25,7 @@ export function parseBuffersToStrings(cacheHandlerValue: CacheHandlerValue) {
     if (appRouteValue?.body) {
       // Convert body Buffer to string
       // See: https://github.com/vercel/next.js/blob/f5444a16ec2ef7b82d30048890b613aa3865c1f1/packages/next/src/server/response-cache/types.ts#L97
-      appRouteData.body = appRouteValue.body.toString();
+      appRouteData.body = appRouteValue.body.toString("base64");
     }
   } else if (kind === "APP_PAGE") {
     const appPageData = value as unknown as RedisCompliantCachedAppPageValue;
@@ -36,7 +34,7 @@ export function parseBuffersToStrings(cacheHandlerValue: CacheHandlerValue) {
     if (appPageValue?.rscData) {
       // Convert rscData Buffer to string
       // See: https://github.com/vercel/next.js/blob/f5444a16ec2ef7b82d30048890b613aa3865c1f1/packages/next/src/server/response-cache/types.ts#L76
-      appPageData.rscData = appPageValue.rscData.toString();
+      appPageData.rscData = appPageValue.rscData.toString("base64");
     }
 
     if (appPageValue?.segmentData) {
@@ -45,7 +43,7 @@ export function parseBuffersToStrings(cacheHandlerValue: CacheHandlerValue) {
       appPageData.segmentData = Object.fromEntries(
         Array.from(appPageValue.segmentData.entries()).map(([key, value]) => [
           key,
-          value.toString(),
+          value.toString("base64"),
         ]),
       );
     }
@@ -63,7 +61,7 @@ export function convertStringsToBuffers(cacheValue: CacheHandlerValue) {
       // Convert body string to Buffer
       // See: https://github.com/vercel/next.js/blob/f5444a16ec2ef7b82d30048890b613aa3865c1f1/packages/next/src/server/response-cache/types.ts#L97
       const appRouteValue = value as unknown as CachedRouteValue;
-      appRouteValue.body = Buffer.from(appRouteData.body, "utf-8");
+      appRouteValue.body = Buffer.from(appRouteData.body, "base64");
     }
   } else if (kind === "APP_PAGE") {
     const appPageData = value as unknown as RedisCompliantCachedAppPageValue;
@@ -72,7 +70,7 @@ export function convertStringsToBuffers(cacheValue: CacheHandlerValue) {
     if (appPageData.rscData) {
       // Convert rscData string to Buffer
       // See: https://github.com/vercel/next.js/blob/f5444a16ec2ef7b82d30048890b613aa3865c1f1/packages/next/src/server/response-cache/types.ts#L76
-      appPageValue.rscData = Buffer.from(appPageData.rscData, "utf-8");
+      appPageValue.rscData = Buffer.from(appPageData.rscData, "base64");
     }
 
     if (appPageData.segmentData) {
@@ -81,7 +79,7 @@ export function convertStringsToBuffers(cacheValue: CacheHandlerValue) {
       appPageValue.segmentData = new Map(
         Object.entries(appPageData.segmentData).map(([key, value]) => [
           key,
-          Buffer.from(value, "utf-8"),
+          Buffer.from(value, "base64"),
         ]),
       );
     }

packages/nextjs-cache-handler/src/instrumentation/register-initial-cache.ts

@@ -260,16 +260,21 @@ export async function registerInitialCache(
     let html: string | undefined;
     let pageData: string | object | undefined;
     let meta: NextRouteMetadata | undefined;
-
+    let rscData: string | undefined;
     try {
-      [html, pageData, meta] = await Promise.all([
+      [html, pageData, rscData, meta] = await Promise.all([
         fsPromises.readFile(`${pathToRouteFiles}.html`, "utf-8"),
         fsPromises
           .readFile(
             `${pathToRouteFiles}.${isAppRouter ? "rsc" : "json"}`,
             "utf-8",
           )
           .then((data) => (isAppRouter ? data : (JSON.parse(data) as object))),
+        isAppRouter
+          ? fsPromises
+              .readFile(`${pathToRouteFiles}.prefetch.rsc`, "utf-8")
+              .then((data) => data)
+          : undefined,
         isAppRouter
           ? fsPromises
               .readFile(`${pathToRouteFiles}.meta`, "utf-8")
@@ -298,7 +303,8 @@ export async function registerInitialCache(
         postponed: meta?.postponed,
         headers: meta?.headers,
         status: meta?.status,
-        rscData: undefined,
+        rscData:
+          isAppRouter && rscData ? Buffer.from(rscData, "utf-8") : undefined,
         segmentData: undefined,
       };