Back to all reviewers

Use unstable_cache directly

calcom/cal.com
Based on 2 comments
TSX

When implementing server-side caching in Next.js applications, prefer using `unstable_cache` with direct repository method calls instead of tRPC callers. This approach provides better performance and proper integration with Next.js caching mechanisms.

Caching TSX

Reviewer Prompt

When implementing server-side caching in Next.js applications, prefer using unstable_cache with direct repository method calls instead of tRPC callers. This approach provides better performance and proper integration with Next.js caching mechanisms.

Instead of using tRPC callers for cached data:

const caller = await createRouterCaller(workflowsRouter);
const initialData = await caller.filteredList({ filters });

Use unstable_cache directly with repository methods:

const getWorkflowsFilteredListCached = unstable_cache(
  async (filters) => { // filters should be serializable
    return await WorkflowRepository.getFilteredList(filters);
  },
  ["getWorkflowsFilteredListCached"],
  {
    revalidate: 3600,
    tags: ["viewer.workflows.filteredList"]
  }
);

const initialData = await getWorkflowsFilteredListCached(filters);

This pattern enables proper cache revalidation using revalidateTag from next/cache in CRUD operations and eliminates unnecessary tRPC overhead for cached operations. Apply this consistently across server components where data caching is needed.

2
Comments Analyzed
TSX
Primary Language
Caching
Category

Source Discussions