fix(qwik-city): don't use stale-while-revalidate

Author: wmertens

.changeset/gentle-bats-thank.md

@@ -0,0 +1,5 @@
+---
+'@builder.io/qwik-city': minor
+---
+
+FIX: qwik-city no longer forces `q-data.json` downloads, instead relying on the cache headers. This means that you have to make sure your `q-data.json` is served with `Cache-Control` headers that suit you. That file contains all the information about the route and is read for each qwik-city navigation. By default the data is cached for one hour.

packages/docs/public/_headers

@@ -11,4 +11,4 @@
   Cache-Control: public, max-age=604800, s-maxage=604800
 
 /*
-  Cache-Control: public, max-age=3600, s-maxage=3600, stale-while-revalidate=86400
+  Cache-Control: public, max-age=3600, s-maxage=3600

packages/docs/src/routes/docs/(qwikcity)/caching/index.mdx

@@ -19,7 +19,7 @@ created_at: '2023-05-24T03:52:24Z'
 
 Caching responses is critical for keeping your site as fast as possible, both for [pages](/docs/(qwikcity)/pages/index.mdx) as well as [middleware](/docs/(qwikcity)/middleware/index.mdx).
 
-A good default is to use [stale-while-revalidate](https://web.dev/stale-while-revalidate/) caching for all responses. 
+A option is to use [stale-while-revalidate](https://web.dev/stale-while-revalidate/) caching for all responses. Note that this means that users will see a cached response even if the server is updated, and only when the user refreshes will they see the updated content.
 
 For instance, we can add an `onGet` export to our root [layout](/docs/(qwikcity)/layout/index.mdx) (`src/routes/layout.tsx`) like so, to apply good caching defaults site-wide:
 

packages/docs/src/routes/examples/[...id]/index!.tsx

@@ -178,8 +178,6 @@ export const onGet: RequestHandler = ({ cacheControl }) => {
   cacheControl({
     public: true,
     maxAge: 3600,
-    sMaxAge: 3600,
-    staleWhileRevalidate: 86400,
   });
 };
 

packages/docs/src/routes/layout.tsx

@@ -10,7 +10,5 @@ export const onGet: RequestHandler = ({ cacheControl }) => {
   cacheControl({
     public: true,
     maxAge: 3600,
-    sMaxAge: 3600,
-    staleWhileRevalidate: 86400,
   });
 };

packages/docs/src/routes/playground/index!.tsx

@@ -135,7 +135,5 @@ export const onGet: RequestHandler = ({ cacheControl }) => {
   cacheControl({
     public: true,
     maxAge: 3600,
-    sMaxAge: 3600,
-    staleWhileRevalidate: 86400,
   });
 };

packages/docs/src/routes/tutorial/layout.tsx

@@ -172,7 +172,5 @@ export const onGet: RequestHandler = ({ cacheControl }) => {
   cacheControl({
     public: true,
     maxAge: 3600,
-    sMaxAge: 3600,
-    staleWhileRevalidate: 86400,
   });
 };

packages/qwik-city/src/middleware/request-handler/cache-control.ts

@@ -20,7 +20,6 @@ export function createCacheControl(cacheControl: CacheControl) {
       public: true,
       immutable: true,
       maxAge: 60 * 60 * 24 * 365,
-      staleWhileRevalidate: 60 * 60 * 24 * 365,
     };
   } else if (cacheControl === 'no-cache') {
     cacheControl = {
@@ -32,7 +31,6 @@ export function createCacheControl(cacheControl: CacheControl) {
     cacheControl = {
       maxAge: cacheControl,
       sMaxAge: cacheControl,
-      staleWhileRevalidate: cacheControl,
     };
   }
 

starters/apps/empty/src/routes/layout.tsx

@@ -7,17 +7,6 @@ import Footer from "../components/starter/footer/footer";
 
 import styles from "./styles.css?inline";
 
-export const onGet: RequestHandler = async ({ cacheControl }) => {
-  // Control caching for this request for best performance and to reduce hosting costs:
-  // https://qwik.dev/docs/caching/
-  cacheControl({
-    // Always serve a cached response by default, up to a week stale
-    staleWhileRevalidate: 60 * 60 * 24 * 7,
-    // Max once every 5 seconds, revalidate on the server to get a fresh version of this page
-    maxAge: 5,
-  });
-};
-
 export const useServerTimeLoader = routeLoader$(() => {
   return {
     date: new Date().toISOString(),