Only serve _app/immutable with immutable cache headers

.changeset/wise-berries-flash.md

@@ -0,0 +1,10 @@
+---
+'@sveltejs/adapter-cloudflare': patch
+'@sveltejs/adapter-cloudflare-workers': patch
+'@sveltejs/adapter-netlify': patch
+'@sveltejs/adapter-node': patch
+'@sveltejs/adapter-vercel': patch
+'@sveltejs/kit': patch
+---
+
+only serve \_app/build with immutable cache header, not \_app/version.json

packages/adapter-cloudflare-workers/files/entry.js

@@ -6,7 +6,7 @@ const static_asset_manifest = JSON.parse(static_asset_manifest_json);
 
 const server = new Server(manifest);
 
-const prefix = `/${manifest.appDir}/`;
+const prefix = `/${manifest.appDir}/build/`;
 
 export default {
 	/**

packages/adapter-cloudflare/src/worker.js

@@ -4,7 +4,7 @@ import * as Cache from 'worktop/cfw.cache';
 
 const server = new Server(manifest);
 
-const prefix = `/${manifest.appDir}/`;
+const prefix = `/${manifest.appDir}/build/`;
 
 /** @type {import('worktop/cfw').Module.Worker<{ ASSETS: import('worktop/cfw.durable').Durable.Object }>} */
 const worker = {

packages/adapter-netlify/src/edge.js

@@ -2,7 +2,7 @@ import { Server } from '0SERVER';
 import { manifest, prerendered } from 'MANIFEST';
 
 const server = new Server(manifest);
-const prefix = `/${manifest.appDir}/`;
+const prefix = `/${manifest.appDir}/build/`;
 
 /**
  * @param { Request } request
@@ -12,6 +12,7 @@ const prefix = `/${manifest.appDir}/`;
 export default function handler(request, context) {
 	if (is_static_file(request)) {
 		// Static files can skip the handler
+		// TODO can we serve _app/build files with an immutable cache header?
 		return;
 	}
 

packages/adapter-node/src/handler.js

@@ -22,18 +22,23 @@ const __dirname = path.dirname(fileURLToPath(import.meta.url));
 
 /**
  * @param {string} path
- * @param {number} max_age
- * @param {boolean} immutable
+ * @param {boolean} client
  */
-function serve(path, max_age, immutable = false) {
+function serve(path, client = false) {
 	return (
 		fs.existsSync(path) &&
 		sirv(path, {
 			etag: true,
-			maxAge: max_age,
-			immutable,
 			gzip: true,
-			brotli: true
+			brotli: true,
+			setHeaders:
+				client &&
+				((res, pathname) => {
+					// only apply to build directory, not e.g. version.json
+					if (pathname.startsWith(`/${manifest.appDir}/build/`)) {
+						res.setHeader('cache-control', 'public,max-age=31536000,immutable');
+					}
+				})
 		})
 	);
 }
@@ -126,9 +131,9 @@ function get_origin(headers) {
 
 export const handler = sequence(
 	[
-		serve(path.join(__dirname, '/client'), 31536000, true),
-		serve(path.join(__dirname, '/static'), 0),
-		serve(path.join(__dirname, '/prerendered'), 0),
+		serve(path.join(__dirname, '/client'), true),
+		serve(path.join(__dirname, '/static')),
+		serve(path.join(__dirname, '/prerendered')),
 		ssr
 	].filter(Boolean)
 );

packages/adapter-vercel/index.js

@@ -180,7 +180,7 @@ async function v1(builder, external) {
 			...prerendered_pages,
 			...prerendered_redirects,
 			{
-				src: `/${builder.config.kit.appDir}/.+`,
+				src: `/${builder.config.kit.appDir}/build/.+`,
 				headers: {
 					'cache-control': 'public, immutable, max-age=31536000'
 				}

packages/kit/src/core/build/build_client.js

@@ -59,7 +59,7 @@ export async function build_client({
 		build: {
 			cssCodeSplit: true,
 			manifest: true,
-			outDir: client_out_dir,
+			outDir: `${client_out_dir}/build`,
 			polyfillDynamicImport: false,
 			rollupOptions: {
 				input,
@@ -95,7 +95,9 @@ export async function build_client({
 	const { chunks, assets } = await create_build(merged_config);
 
 	/** @type {import('vite').Manifest} */
-	const vite_manifest = JSON.parse(fs.readFileSync(`${client_out_dir}/manifest.json`, 'utf-8'));
+	const vite_manifest = JSON.parse(
+		fs.readFileSync(`${client_out_dir}/build/manifest.json`, 'utf-8')
+	);
 
 	const entry = posixify(client_entry_file);
 	const entry_js = new Set();

packages/kit/src/core/build/build_server.js

@@ -69,7 +69,7 @@ export class Server {
 			manifest,
 			method_override: ${s(config.kit.methodOverride)},
 			paths: { base, assets },
-			prefix: assets + '/${config.kit.appDir}/',
+			prefix: assets + '/${config.kit.appDir}/build/',
 			prerender: {
 				default: ${config.kit.prerender.default},
 				enabled: ${config.kit.prerender.enabled}

packages/kit/src/core/build/build_service_worker.js

@@ -44,7 +44,7 @@ export async function build_service_worker(
 
 			export const build = [
 				${Array.from(build)
-					.map((file) => `${s(`${config.kit.paths.base}/${config.kit.appDir}/${file}`)}`)
+					.map((file) => `${s(`${config.kit.paths.base}/${config.kit.appDir}/build/${file}`)}`)
 					.join(',\n\t\t\t\t')}
 			];
 

packages/kit/src/core/build/index.js

@@ -34,7 +34,7 @@ export async function build(config, { log }) {
 		// during `svelte-kit preview`, because we use a local asset path. If Vite
 		// used relative paths, I _think_ this could get fixed. Issue here:
 		// https://github.com/vitejs/vite/issues/2009
-		assets_base: `${config.kit.paths.assets || config.kit.paths.base}/${config.kit.appDir}/`,
+		assets_base: `${config.kit.paths.assets || config.kit.paths.base}/${config.kit.appDir}/build/`,
 		manifest_data,
 		output_dir,
 		client_entry_file: path.relative(cwd, `${get_runtime_path(config)}/client/start.js`),
@@ -65,8 +65,8 @@ export async function build(config, { log }) {
 
 	const files = new Set([
 		...static_files,
-		...client.chunks.map((chunk) => `${config.kit.appDir}/${chunk.fileName}`),
-		...client.assets.map((chunk) => `${config.kit.appDir}/${chunk.fileName}`)
+		...client.chunks.map((chunk) => `${config.kit.appDir}/build/${chunk.fileName}`),
+		...client.assets.map((chunk) => `${config.kit.appDir}/build/${chunk.fileName}`)
 	]);
 
 	// TODO is this right?

packages/kit/src/core/preview/index.js

@@ -66,8 +66,12 @@ export async function preview({ port, host, config, https: use_https = false })
 		scoped(
 			assets,
 			sirv(join(config.kit.outDir, 'output/client'), {
-				maxAge: 31536000,
-				immutable: true
+				setHeaders: (res, pathname) => {
+					// only apply to build directory, not e.g. version.json
+					if (pathname.startsWith(`/${config.kit.appDir}/build`)) {
+						res.setHeader('cache-control', 'public,max-age=31536000,immutable');
+					}
+				}
 			})
 		),
 

packages/kit/src/runtime/client/client.js

@@ -11,7 +11,7 @@ import {
 	notifiable_store,
 	scroll_state
 } from './utils.js';
-import * as fetcher from './fetcher.js';
+import { increment, decrement, initial_fetch, native_fetch } from './fetcher.js';
 import { parse } from './parse.js';
 
 import Root from '__GENERATED__/root.svelte';
@@ -594,7 +594,7 @@ export function create_client({ target, session, base, trailing_slash }) {
 					add_dependency(normalized);
 
 					// prerendered pages may be served from any origin, so `initial_fetch` urls shouldn't be normalized
-					return started ? fetcher.native(normalized, init) : fetcher.initial(requested, init);
+					return started ? native_fetch(normalized, init) : initial_fetch(requested, init);
 				},
 				status: status ?? null,
 				error: error ?? null
@@ -613,10 +613,10 @@ export function create_client({ target, session, base, trailing_slash }) {
 
 			if (import.meta.env.DEV) {
 				try {
-					fetcher.increment();
+					increment();
 					loaded = await module.load.call(null, load_input);
 				} finally {
-					fetcher.decrement();
+					decrement();
 				}
 			} else {
 				loaded = await module.load.call(null, load_input);
@@ -704,7 +704,7 @@ export function create_client({ target, session, base, trailing_slash }) {
 					const is_shadow_page = has_shadow && i === a.length - 1;
 
 					if (is_shadow_page) {
-						const res = await fetcher.native(
+						const res = await native_fetch(
 							`${url.pathname}${url.pathname.endsWith('/') ? '' : '/'}__data.json${url.search}`,
 							{
 								headers: {

packages/kit/src/runtime/client/fetcher.js

@@ -2,7 +2,7 @@ import { hash } from '../hash.js';
 
 let loading = 0;
 
-export const native = window.fetch;
+export const native_fetch = window.fetch;
 
 export function increment() {
 	loading += 1;
@@ -32,15 +32,16 @@ if (import.meta.env.DEV) {
 				`Loading ${url} using \`window.fetch\`. For best results, use the \`fetch\` that is passed to your \`load\` function: https://kit.svelte.dev/docs/loading#input-fetch`
 			);
 		}
-		return native(input, init);
+
+		return native_fetch(input, init);
 	};
 }
 
 /**
  * @param {RequestInfo} resource
  * @param {RequestInit} [opts]
  */
-export function initial(resource, opts) {
+export function initial_fetch(resource, opts) {
 	const url = JSON.stringify(typeof resource === 'string' ? resource : resource.url);
 
 	let selector = `script[sveltekit\\:data-type="data"][sveltekit\\:data-url=${url}]`;
@@ -55,5 +56,5 @@ export function initial(resource, opts) {
 		return Promise.resolve(new Response(body, init));
 	}
 
-	return native(resource, opts);
+	return native_fetch(resource, opts);
 }

packages/kit/test/apps/basics/test/test.js

@@ -347,7 +347,7 @@ test.describe.parallel('Imports', () => {
 			]);
 		} else {
 			expect(sources[0].startsWith('data:image/png;base64,')).toBeTruthy();
-			expect(sources[1]).toBe(`${baseURL}/_app/assets/large-3183867c.jpg`);
+			expect(sources[1]).toBe(`${baseURL}/_app/build/assets/large-3183867c.jpg`);
 		}
 	});
 });
@@ -2636,3 +2636,13 @@ test.describe.parallel('XSS', () => {
 		);
 	});
 });
+
+test.describe.parallel('Version', () => {
+	test('does not serve version.json with an immutable cache header', async ({ request }) => {
+		// this isn't actually a great test, because caching behaviour is down to adapters.
+		// but it's better than nothing
+		const response = await request.get('/_app/version.json');
+		const headers = response.headers();
+		expect(headers['cache-control'] || '').not.toContain('immutable');
+	});
+});