077097b7f8
* Add licences to all example/package.json that lack them * Revert "Add licences to all example/package.json that lack them" This reverts commit 5d4e25012f7334772b8ef5924bc355277e827cba. * Update check-examples to remove `license` field from examples * Remove `license` from all examples. This was mentioned in vercel/next.js#27121 but it looks like it didn't end up being in the merge? Co-authored-by: JJ Kasper <jj@jjsweb.site> |
||
|---|---|---|
| .. | ||
| pages | ||
| .gitignore | ||
| package.json | ||
| README.md | ||
Server-Side Rendering Caching Headers
This example uses stale-while-revalidate cache-control headers in combination with getServerSideProps for server-rendering.
pages/index.js uses getServerSideProps to forward the request header to the React component, as well as setting a response header. This cache-control header uses stale-while-revalidate to cache the server response.
pages/index.js is considered fresh for ten seconds (s-maxage=10). If a request is repeated within the next 10 seconds, the previously cached value will still be fresh. If the request is repeated before 59 seconds, the cached value will be stale but still render (stale-while-revalidate=59).
In the background, a revalidation request will be made to populate the cache with a fresh value. If you refresh the page, you will see the new value shown.
Preview
Preview the example live on StackBlitz:
Deploy your own
Deploy the example using Vercel:
How to use
Execute create-next-app with npm or Yarn to bootstrap the example:
npx create-next-app --example ssr-caching ssr-caching-app
# or
yarn create next-app --example ssr-caching ssr-caching-app
Deploy it to the cloud with Vercel (Documentation).