What happens if you have nested "use cache"?

[onarbf]

I am testing the new "use cache" way, but I have some serious questions about it.

Imagine I want to add a granular cache in each "get" query: getTodo query, getTodoStats query, etc

Then I am using a function getTodos, that calls all of them in user/[userId]/todo/page.tsx.

I have then "use cache" cacheTag("todos-${userId}") and nested on it, all the use cache of each getTodo cacheTag("todo-${todoId}").

What is happenning on this case if I have only revalidatePath on the createTodo or updateTodo)

[marcusvramos]

When you have nested "use cache" directives in Next.js 15, each cache layer works independently with its own tags and scope.

In your example:

1. Outer cache (getTodos with cacheTag("todos-${userId}")) - caches the entire result
2. Inner caches (getTodo, getTodoStats with cacheTag("todo-${todoId}")) - cache individual queries

How it works:

• If the outer cache is fresh, Next.js returns it immediately without calling the inner functions
• If the outer cache is stale but inner caches are fresh, inner functions return cached data
• When you call revalidatePath() or revalidateTag(), only the matching cache layers are invalidated

Your scenario with revalidatePath on createTodo/updateTodo:

• If you only use revalidatePath(), it will invalidate route-level caches
• To invalidate specific todo items, use revalidateTag("todo-${todoId}")
• To invalidate the user's entire todo list, use revalidateTag("todos-${userId}")

This granular approach is actually powerful for performance - you can update just one todo without invalidating the entire list!

[onarbf]

thanks for the answer, then, if I understood well:
if I revalidateTag("todo-${todoId}" but I don't revalidate the outer cache, the getTodos will return stale data, and not refresh data, as it still has not been revalidated, right?

[marcusvramos]

Yes, exactly! If you revalidateTag('todo-${todoId}') but don't revalidate the outer cache, getTodos will return stale data.

Example scenario:

1. getTodos() caches the list: [{id: 1, title: "Buy milk"}, {id: 2, title: "Clean"}]
2. You update todo with id 1, changing title to "Buy eggs"
3. You call revalidateTag('todo-1')
4. Now getTodo(1) returns fresh data: {id: 1, title: "Buy eggs"}
5. But getTodos() still returns the old cached list with "Buy milk"

Solution:
When you mutate a todo, you need to revalidate both:

revalidateTag('todo-1')      // Revalidate individual todo
revalidateTag('todos-list')  // Revalidate the list

Or use revalidatePath() which invalidates all caches in that path:

revalidatePath('/todos')  // Simpler, invalidates everything

The trade-off: granular tags give you precise control but require careful management. revalidatePath is simpler but less selective.