MENU
Caching
A Next.js app is typically very fast as Next.js provides an elaborate set of caching features.
Beware that the development server and production server behave differently in term of caching:
| caching feature | purpose | development server | production server |
| fetch() Memoization | avoid duplicate fetches in server components during a single request | enabled | enabled |
| Data Cache | avoid duplicate fetches in server components across multiple requests | disabled | enabled |
| Build Cache | speed up the compilation of the web app | irrelevant | enabled |
| Full Route Cache | avoid duplicate regeneration of pages and components on the server | disabled | enabled |
| Client Router Cache | avoid duplicate requests for pages and components on the client | disabled | enabled |
Consider further caching by:
- manually memoizing non-built-in functions.
- memoizing fetch() requests on the client side with React's built-in hooks.
Also consider adjusting the various different cache-related configuration options in next.config.js.