Next.js Discord

Discord Forum

How does `use cache: private` work?

Unanswered
Giant Angora posted this in #help-forum
Open in Discord
Giant AngoraOP
I am trying to understand how "use cache: private" works
I created a function which uses it with cacheLife("hours")

import { cacheLife, cacheTag } from "next/cache";

export const dynamic = () => {
  "use cache: private";
  cacheLife("hours");

  return new Promise<string>((resolve) =>
    setTimeout(() => {
      resolve(Math.random().toString().substring(2, 5));
    }, 5000)
  );
};

export async function DynamicComp() {
  const value = await dynamic();

  return <div>dynamic: {value}</div>;
}


Now things start to get weird.
I started using the component withtout wrapping in suspense (which works perfectly fine with "use cache" and "use cache: remote") and received the following error:
Uncached data was accessed outside of <Suspense>
Than I tried to use it with suspense, and figured the function is running on every refresh and routing navigation, showing the suspenses's fallback.

when I added cacheTag("private") it suddenly started blocking while the next floating tool shows prefetching.

Please someone explain to me how does this directive work? I seem to miss something here.

My next config for added context:
const nextConfig: NextConfig = {
  /* config options here */
  reactCompiler: true,
  cacheComponents: true,
};

0 Replies