How does `use cache: private` work?
Unanswered
Giant Angora posted this in #help-forum
Giant AngoraOP
I am trying to understand how
I created a function which uses it with
Now things start to get weird.
I started using the component withtout wrapping in suspense (which works perfectly fine with
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
Please someone explain to me how does this directive work? I seem to miss something here.
My next config for added context:
"use cache: private" worksI 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,
};