TracksWork-ready Next.jsCoursesControlling cached content in Next.js

Controlling cached content in Next.js

Simeon Griggs
Simeon GriggsPrincipal Educator at Sanity
Last updated 4 months ago
7
Lessons

Creating a high performance web application for fast loading depends on caching. Learn how to implement a caching strategy you can understand, debug and depend on.

1. Caching Fundamentals

1
Task

Next.js has prioritized performance with its caching methods and expects you to configure them. Learn how to integrate the Next.js cache and Sanity CDN for high performance.

2. Demystifying caching in development

4
Tasks

Set up Next.js so that as you make changes and navigate through the application, you can observe the impact of your cache configuration.

3. Combining Sanity CDN with the Next.js Cache

4
Tasks

Implement Sanity Client in a way that compliments and leverages the Next.js cache with sensible defaults.

4. Time-based cache revalidation

2
Tasks

Time-based revalidation is simple to setup and predictable. It might be "enough" for your project.

5. Path-based revalidation

14
Tasks

Surgically revalidate individual post pages by their path when updates are made to their document in Sanity Studio.

6. Tag-based revalidation

11
Tasks

Assign tags to queries to revalidate the cache of many paths by targeting any individual tag.

7. Quiz to win cache prizes

Let's review what you've learned about caching and balancing the content you have with the people it serves.