From 3684cbe204961ff6997eb55cc363b19838d398ca Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Wed, 12 Mar 2025 22:29:47 +0000
Subject: [PATCH 01/24] initial commit

---
 packages/kit/package.json                     |   8 +-
 .../core/sync/create_manifest_data/index.js   |  54 +++++++++
 packages/kit/src/exports/public.d.ts          |   1 +
 packages/kit/src/exports/vite/dev/index.js    |   1 +
 packages/kit/src/exports/vite/index.js        |  39 ++++++-
 packages/kit/src/exports/vite/remote/index.js |  72 ++++++++++++
 packages/kit/src/runtime/client/client.js     |  27 +++++
 packages/kit/src/runtime/server/page/index.js |   5 +
 packages/kit/src/runtime/server/page/rpc.js   | 104 ++++++++++++++++++
 packages/kit/src/types/internal.d.ts          |   1 +
 playgrounds/basic/src/lib/foo.remote.js       |   9 ++
 playgrounds/basic/src/routes/+layout.svelte   |   2 -
 playgrounds/basic/src/routes/+page.svelte     |  14 +--
 pnpm-lock.yaml                                |  21 ++++
 14 files changed, 346 insertions(+), 12 deletions(-)
 create mode 100644 packages/kit/src/exports/vite/remote/index.js
 create mode 100644 packages/kit/src/runtime/server/page/rpc.js
 create mode 100644 playgrounds/basic/src/lib/foo.remote.js

diff --git a/packages/kit/package.json b/packages/kit/package.json
index 80763f3056c5..a29f9a0d0ec0 100644
--- a/packages/kit/package.json
+++ b/packages/kit/package.json
@@ -28,7 +28,10 @@
 		"mrmime": "^2.0.0",
 		"sade": "^1.8.1",
 		"set-cookie-parser": "^2.6.0",
-		"sirv": "^3.0.0"
+		"sirv": "^3.0.0",
+		"acorn": "^8.12.1",
+		"@sveltejs/acorn-typescript": "^1.0.5",
+		"zimmerframe": "^1.1.2"
 	},
 	"devDependencies": {
 		"@playwright/test": "^1.44.1",
@@ -42,7 +45,8 @@
 		"svelte-preprocess": "^6.0.0",
 		"typescript": "^5.3.3",
 		"vite": "^6.0.11",
-		"vitest": "^3.0.1"
+		"vitest": "^3.0.1",
+		"@types/estree": "^1.0.5"
 	},
 	"peerDependencies": {
 		"@sveltejs/vite-plugin-svelte": "^3.0.0 || ^4.0.0-next.1 || ^5.0.0",
diff --git a/packages/kit/src/core/sync/create_manifest_data/index.js b/packages/kit/src/core/sync/create_manifest_data/index.js
index 037f8dc8f6ba..e0288370fd8e 100644
--- a/packages/kit/src/core/sync/create_manifest_data/index.js
+++ b/packages/kit/src/core/sync/create_manifest_data/index.js
@@ -8,6 +8,7 @@ import { posixify, resolve_entry } from '../../../utils/filesystem.js';
 import { parse_route_id } from '../../../utils/routing.js';
 import { sort_routes } from './sort.js';
 import { isSvelte5Plus } from '../utils.js';
+import { hash } from '../../../runtime/hash.js';
 
 /**
  * Generates the manifest data used for the client-side manifest and types generation.
@@ -27,6 +28,7 @@ export default function create_manifest_data({
 	const hooks = create_hooks(config, cwd);
 	const matchers = create_matchers(config, cwd);
 	const { nodes, routes } = create_routes_and_nodes(cwd, config, fallback);
+	const remotes = create_remotes(cwd);
 
 	for (const route of routes) {
 		for (const param of route.params) {
@@ -41,6 +43,7 @@ export default function create_manifest_data({
 		hooks,
 		matchers,
 		nodes,
+		remotes,
 		routes
 	};
 }
@@ -465,6 +468,57 @@ function create_routes_and_nodes(cwd, config, fallback) {
 	};
 }
 
+/**
+ * @param {string} cwd
+ */
+function create_remotes(cwd) {
+	/**
+	 * @type {Map<string, string>}
+	 */
+	const remotes = new Map();
+
+	const valid_extensions = ['.remote.ts', '.remote.js'];
+
+	/**
+	 * @param {number} depth
+	 * @param {string} id
+	 */
+	const walk = (depth, id) => {
+		const dir = path.join(cwd, id);
+		console.log(dir);
+
+		// We can't use withFileTypes because of a NodeJs bug which returns wrong results
+		// with isDirectory() in case of symlinks: https://github.com/nodejs/node/issues/30646
+		const files = fs.readdirSync(dir).map((name) => ({
+			is_dir: fs.statSync(path.join(dir, name)).isDirectory(),
+			name
+		}));
+
+		// process files first
+		for (const file of files) {
+			if (file.is_dir) continue;
+
+			const ext = valid_extensions.find((ext) => file.name.endsWith(ext));
+			if (!ext) continue;
+			const source = fs.readFileSync(path.join(dir, file.name), 'utf-8');
+
+			remotes.set(hash(source), path.join(cwd, id, file.name));
+		}
+
+		// then handle children
+		for (const file of files) {
+			if (file.is_dir) {
+				if (file.name === 'node_modules') continue;
+				walk(depth + 1, path.posix.join(id, file.name));
+			}
+		}
+	};
+
+	walk(0, '/');
+
+	return remotes;
+}
+
 /**
  * @param {string} project_relative
  * @param {string} file
diff --git a/packages/kit/src/exports/public.d.ts b/packages/kit/src/exports/public.d.ts
index 2ff29f3571a0..4d37c6ecf46c 100644
--- a/packages/kit/src/exports/public.d.ts
+++ b/packages/kit/src/exports/public.d.ts
@@ -1319,6 +1319,7 @@ export interface SSRManifest {
 	_: {
 		client: NonNullable<BuildData['client']>;
 		nodes: SSRNodeLoader[];
+		remotes: Map<string, string>;
 		routes: SSRRoute[];
 		prerendered_routes: Set<string>;
 		matchers: () => Promise<Record<string, ParamMatcher>>;
diff --git a/packages/kit/src/exports/vite/dev/index.js b/packages/kit/src/exports/vite/dev/index.js
index 7049d8910508..57a4e819c46b 100644
--- a/packages/kit/src/exports/vite/dev/index.js
+++ b/packages/kit/src/exports/vite/dev/index.js
@@ -248,6 +248,7 @@ export async function dev(vite, vite_config, svelte_config) {
 					};
 				}),
 				prerendered_routes: new Set(),
+				remotes: manifest_data.remotes,
 				routes: compact(
 					manifest_data.routes.map((route) => {
 						if (!route.page && !route.endpoint) return null;
diff --git a/packages/kit/src/exports/vite/index.js b/packages/kit/src/exports/vite/index.js
index bdb37b1f9cff..721092a95242 100644
--- a/packages/kit/src/exports/vite/index.js
+++ b/packages/kit/src/exports/vite/index.js
@@ -36,6 +36,7 @@ import {
 } from './module_ids.js';
 import { resolve_peer_dependency } from '../../utils/import.js';
 import { compact } from '../../utils/array.js';
+import { transform_client } from './remote/index.js';
 
 const cwd = process.cwd();
 
@@ -398,6 +399,9 @@ async function kit({ svelte_config }) {
 				// ids with :$ don't work with reverse proxies like nginx
 				return `\0virtual:${id.substring(1)}`;
 			}
+			if (id === '__sveltekit/remote') {
+				return `${runtime_directory}/client/client.js`;
+			}
 			if (id.startsWith('__sveltekit/')) {
 				return `\0virtual:${id}`;
 			}
@@ -578,6 +582,39 @@ Tips:
 		}
 	};
 
+	/**
+	 * @type {any}
+	 */
+	let root;
+
+	const plugin_remote = {
+		name: 'vite-plugin-sveltekit-remote',
+
+		/**
+		 * @param {{ root: any; }} config
+		 */
+		configResolved(config) {
+			root = config.root;
+		},
+
+		/**
+		 * @param {string} code
+		 * @param {string} id
+		 * @param {any} opts
+		 */
+		transform(code, id, opts) {
+			if (!id.endsWith('.remote.js') && !id.endsWith('.remote.ts')) return;
+
+			if (opts.ssr) {
+				return;
+			}
+
+			const filename = id.replace(root, '');
+
+			return transform_client(code, filename);
+		}
+	};
+
 	/** @type {import('vite').Plugin} */
 	const plugin_compile = {
 		name: 'vite-plugin-sveltekit-compile',
@@ -1072,7 +1109,7 @@ Tips:
 		}
 	};
 
-	return [plugin_setup, plugin_virtual_modules, plugin_guard, plugin_compile];
+	return [plugin_setup, plugin_remote, plugin_virtual_modules, plugin_guard, plugin_compile];
 }
 
 /**
diff --git a/packages/kit/src/exports/vite/remote/index.js b/packages/kit/src/exports/vite/remote/index.js
new file mode 100644
index 000000000000..7beecf365c18
--- /dev/null
+++ b/packages/kit/src/exports/vite/remote/index.js
@@ -0,0 +1,72 @@
+/** @import { Visitors } from 'zimmerframe' */
+/** @import * as ESTree from 'estree' */
+
+import * as acorn from 'acorn';
+import { tsPlugin } from '@sveltejs/acorn-typescript';
+import { walk } from 'zimmerframe';
+import MagicString from 'magic-string';
+import { hash } from '../../../runtime/hash.js';
+
+const ParserWithTS = acorn.Parser.extend(tsPlugin());
+
+/**
+ * @param {string} code
+ * @param {string} filename
+ */
+export function transform_client(code, filename) {
+	const parser = filename.endsWith('.ts') ? ParserWithTS : acorn.Parser;
+
+	const ast = /** @type {ESTree.Program} */ (
+		parser.parse(code, {
+			sourceType: 'module',
+			ecmaVersion: 13,
+			locations: true
+		})
+	);
+
+	const s = new MagicString(code);
+	const _hash = hash(code);
+
+	/** @type {Visitors<ESTree.Node, null>} */
+	const visitors = {
+		ExportNamedDeclaration(node, context) {
+			const declaration = node.declaration;
+
+			if (declaration?.type === 'FunctionDeclaration') {
+				const name = declaration.id.name;
+				s.update(
+					// @ts-ignore
+					declaration.start,
+					// @ts-ignore
+					declaration.end,
+					`async function ${name}(...args) { return await remote_call('${_hash}', '${name}', args); }`
+				);
+			} else if (declaration?.type === 'VariableDeclaration') {
+				for (const declarator of declaration.declarations) {
+					const id = declarator.id;
+					if (id.type == 'Identifier') {
+						s.update(
+							// @ts-ignore
+							declarator.start,
+							// @ts-ignore
+							declarator.end,
+							`${id.name} = async (...args) => { return await remote_call('${_hash}', '${id.name}', args); }`
+						);
+					} else {
+						// TODO: do we throw an error here?
+					}
+				}
+			} else {
+				// TODO: do we throw an error here?
+			}
+
+			context.next();
+		}
+	};
+
+	walk(ast, null, visitors);
+
+	s.prepend("import { remote_call } from '__sveltekit/remote';");
+
+	return s.toString();
+}
diff --git a/packages/kit/src/runtime/client/client.js b/packages/kit/src/runtime/client/client.js
index ecfb49b74da8..bbebb1ab7873 100644
--- a/packages/kit/src/runtime/client/client.js
+++ b/packages/kit/src/runtime/client/client.js
@@ -2949,3 +2949,30 @@ if (DEV) {
 		});
 	}
 }
+
+/**
+ * @param {string} hash
+ * @param {string} func_name
+ * @param {any} args
+ */
+export async function remote_call(hash, func_name, args) {
+	const transport = app.hooks.transport;
+	const encoders = Object.fromEntries(
+		Object.entries(transport).map(([key, value]) => [key, value.encode])
+	);
+	const body = devalue.stringify(args, encoders);
+
+	const response = await fetch('/remote', {
+		method: 'POST',
+		body,
+		headers: {
+			'Content-Type': 'application/json',
+			'sk-rpc': JSON.stringify([hash, func_name])
+		}
+	});
+
+	const json = await response.text();
+	const parsed = JSON.parse(json);
+
+	return devalue.parse(parsed.data, app.decoders);
+}
diff --git a/packages/kit/src/runtime/server/page/index.js b/packages/kit/src/runtime/server/page/index.js
index 01337e4cac1c..e19dee72da0d 100644
--- a/packages/kit/src/runtime/server/page/index.js
+++ b/packages/kit/src/runtime/server/page/index.js
@@ -15,6 +15,7 @@ import { render_response } from './render.js';
 import { respond_with_error } from './respond_with_error.js';
 import { get_data_json } from '../data/index.js';
 import { DEV } from 'esm-env';
+import { handle_rpc_json_request, is_rpc_json_request } from './rpc.js';
 
 /**
  * The maximum request depth permitted before assuming we're stuck in an infinite loop
@@ -39,6 +40,10 @@ export async function render_page(event, page, options, manifest, state, nodes,
 		});
 	}
 
+	if (is_rpc_json_request(event)) {
+		return await handle_rpc_json_request(event, options, manifest);
+	}
+
 	if (is_action_json_request(event)) {
 		const node = await manifest._.nodes[page.leaf]();
 		return handle_action_json_request(event, options, node?.server);
diff --git a/packages/kit/src/runtime/server/page/rpc.js b/packages/kit/src/runtime/server/page/rpc.js
new file mode 100644
index 000000000000..a1ea7f34fff9
--- /dev/null
+++ b/packages/kit/src/runtime/server/page/rpc.js
@@ -0,0 +1,104 @@
+import { negotiate } from '../../../utils/http.js';
+import { json } from '../../../exports/index.js';
+import { SvelteKitError } from '../../control.js';
+import { handle_error_and_jsonify } from '../utils.js';
+import * as devalue from 'devalue';
+
+/** @param {import('@sveltejs/kit').RequestEvent} event */
+export function is_rpc_json_request(event) {
+	const rpc_data = event.request.headers.get('sk-rpc');
+
+	if (rpc_data == null) return false;
+	const json = JSON.parse(rpc_data);
+	if (!Array.isArray(json) || json.length !== 2) return false;
+
+	const accept = negotiate(event.request.headers.get('accept') ?? '*/*', ['application/json']);
+
+	return accept === 'application/json' && event.request.method === 'POST';
+}
+
+/**
+ * @param {import('@sveltejs/kit').RequestEvent} event
+ * @param {import("types").SSROptions} options
+ */
+async function bad_rpc(event, options) {
+	const bad_rpc = new SvelteKitError(
+		405,
+		'Method Not Allowed',
+		'POST method not allowed for this remote procedure call'
+	);
+
+	return json(
+		{
+			type: 'error',
+			error: await handle_error_and_jsonify(event, options, bad_rpc)
+		},
+		{
+			status: bad_rpc.status,
+			headers: {
+				// https://developer.mozilla.org/en-US/docs/Web/HTTP/Status/405
+				// "The server must generate an Allow header field in a 405 status code response"
+				allow: 'GET'
+			}
+		}
+	);
+}
+
+/**
+ * @param {import('@sveltejs/kit').RequestEvent} event
+ * @param {import('types').SSROptions} options
+ * @param {import('@sveltejs/kit').SSRManifest} manifest
+ */
+export async function handle_rpc_json_request(event, options, manifest) {
+	const [hash, func_name] = JSON.parse(/** @type {string} */ (event.request.headers.get('sk-rpc')));
+	const remotes = manifest._.remotes;
+
+	if (!remotes.has(hash)) {
+		return await bad_rpc(event, options);
+	}
+
+	const remote = /** @type {string} */ (remotes.get(hash));
+	let func;
+
+	try {
+		const module = await import(remote);
+		func = module[func_name];
+	} catch {
+		return await bad_rpc(event, options);
+	}
+
+	const transport = options.hooks.transport;
+	const args_json = await event.request.text();
+	const decoders = Object.fromEntries(Object.entries(transport).map(([k, v]) => [k, v.decode]));
+	const args = devalue.parse(args_json, decoders);
+	let data;
+
+	try {
+		data = await func.apply(null, args);
+	} catch (/** @type {any} */ e) {
+		return json({
+			type: 'error',
+			status: 500,
+			error: await handle_error_and_jsonify(event, options, e)
+		});
+	}
+
+	return json({
+		type: 'success',
+		status: data ? 200 : 204,
+		data: stringify_rpc_response(data, transport)
+	});
+}
+
+/**
+ * Try to `devalue.stringify` the data object, and if it fails, return a proper Error with context
+ * @param {any} data
+ * @param {import('types').ServerHooks['transport']} transport
+ */
+function stringify_rpc_response(data, transport) {
+	const encoders = Object.fromEntries(
+		Object.entries(transport).map(([key, value]) => [key, value.encode])
+	);
+
+	return devalue.stringify(data, encoders);
+}
diff --git a/packages/kit/src/types/internal.d.ts b/packages/kit/src/types/internal.d.ts
index 82317e8417ab..05445fb8176a 100644
--- a/packages/kit/src/types/internal.d.ts
+++ b/packages/kit/src/types/internal.d.ts
@@ -188,6 +188,7 @@ export interface ManifestData {
 		universal: string | null;
 	};
 	nodes: PageNode[];
+	remotes: Map<string, string>;
 	routes: RouteData[];
 	matchers: Record<string, string>;
 }
diff --git a/playgrounds/basic/src/lib/foo.remote.js b/playgrounds/basic/src/lib/foo.remote.js
new file mode 100644
index 000000000000..e069a73977d4
--- /dev/null
+++ b/playgrounds/basic/src/lib/foo.remote.js
@@ -0,0 +1,9 @@
+/**
+ * @param {number} a
+ * @param {number} b
+ */
+export const add = (a, b) => {
+	console.log('add', a, b);
+
+	return a + b;
+};
diff --git a/playgrounds/basic/src/routes/+layout.svelte b/playgrounds/basic/src/routes/+layout.svelte
index 707b3afe5a1e..e85e983d2ee4 100644
--- a/playgrounds/basic/src/routes/+layout.svelte
+++ b/playgrounds/basic/src/routes/+layout.svelte
@@ -2,8 +2,6 @@
 	import { page, navigating } from '$app/state';
 
 	let { children } = $props();
-
-	$inspect(navigating.to);
 </script>
 
 <nav>
diff --git a/playgrounds/basic/src/routes/+page.svelte b/playgrounds/basic/src/routes/+page.svelte
index b3872f2e7f2c..ebb33b871751 100644
--- a/playgrounds/basic/src/routes/+page.svelte
+++ b/playgrounds/basic/src/routes/+page.svelte
@@ -1,15 +1,15 @@
 <script lang="ts">
 	import type { PageData } from './$types';
+	import { add } from '$lib/foo.remote.js';
 
 	let { data }: { data: PageData } = $props();
 </script>
 
 <h1>Welcome to SvelteKit</h1>
 
-2 + 2 = {data.sum}
-
-<h2>Pages:</h2>
-
-<ul>
-	<li><a href="images">images</a></li>
-</ul>
+<button
+	onclick={async () => {
+		const result = await add(2, 3);
+		console.log(result);
+	}}>add</button
+>
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index f0301292918b..5cf797e0c191 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -339,9 +339,15 @@ importers:
 
   packages/kit:
     dependencies:
+      '@sveltejs/acorn-typescript':
+        specifier: ^1.0.5
+        version: 1.0.5(acorn@8.14.0)
       '@types/cookie':
         specifier: ^0.6.0
         version: 0.6.0
+      acorn:
+        specifier: ^8.12.1
+        version: 8.14.0
       cookie:
         specifier: ^0.6.0
         version: 0.6.0
@@ -372,6 +378,9 @@ importers:
       sirv:
         specifier: ^3.0.0
         version: 3.0.0
+      zimmerframe:
+        specifier: ^1.1.2
+        version: 1.1.2
     devDependencies:
       '@playwright/test':
         specifier: ^1.44.1
@@ -382,6 +391,9 @@ importers:
       '@types/connect':
         specifier: ^3.4.38
         version: 3.4.38
+      '@types/estree':
+        specifier: ^1.0.5
+        version: 1.0.6
       '@types/node':
         specifier: ^18.19.48
         version: 18.19.50
@@ -1956,6 +1968,11 @@ packages:
     peerDependencies:
       eslint: '>=8.40.0'
 
+  '@sveltejs/acorn-typescript@1.0.5':
+    resolution: {integrity: sha512-IwQk4yfwLdibDlrXVE04jTZYlLnwsTT2PIOQQGNLWfjavGifnk1JD1LcZjZaBTRcxZu2FfPfNLOE04DSu9lqtQ==}
+    peerDependencies:
+      acorn: ^8.9.0
+
   '@sveltejs/eslint-config@8.1.0':
     resolution: {integrity: sha512-cfgp4lPREYBjNd4ZzaP/jA85ufm7vfXiaV7h9vILXNogne80IbZRNhRCQ8XoOqTAOY/pChIzWTBuR8aDNMbAEA==}
     peerDependencies:
@@ -4333,6 +4350,10 @@ snapshots:
       eslint-visitor-keys: 4.2.0
       espree: 10.3.0
 
+  '@sveltejs/acorn-typescript@1.0.5(acorn@8.14.0)':
+    dependencies:
+      acorn: 8.14.0
+
   '@sveltejs/eslint-config@8.1.0(@stylistic/eslint-plugin-js@2.1.0(eslint@9.6.0))(eslint-config-prettier@9.1.0(eslint@9.6.0))(eslint-plugin-n@17.16.1(eslint@9.6.0)(typescript@5.6.3))(eslint-plugin-svelte@2.41.0(eslint@9.6.0)(svelte@5.2.9))(eslint@9.6.0)(typescript-eslint@8.26.0(eslint@9.6.0)(typescript@5.6.3))(typescript@5.6.3)':
     dependencies:
       '@stylistic/eslint-plugin-js': 2.1.0(eslint@9.6.0)

From 33fecc0838c5f6c23b445f11c56ecea38bc9d883 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 13 Mar 2025 06:50:12 -0400
Subject: [PATCH 02/24] various fixes

---
 .../kit/src/core/generate_manifest/index.js   |  4 ++
 .../core/sync/create_manifest_data/index.js   | 56 +++----------------
 packages/kit/src/exports/public.d.ts          |  2 +-
 packages/kit/src/exports/vite/dev/index.js    |  8 ++-
 packages/kit/src/exports/vite/index.js        |  9 ++-
 packages/kit/src/exports/vite/remote/index.js |  2 +-
 packages/kit/src/runtime/server/page/rpc.js   |  9 +--
 packages/kit/src/types/internal.d.ts          |  2 +-
 8 files changed, 34 insertions(+), 58 deletions(-)

diff --git a/packages/kit/src/core/generate_manifest/index.js b/packages/kit/src/core/generate_manifest/index.js
index eaaf9e6cd38e..c3c2fbcfbc75 100644
--- a/packages/kit/src/core/generate_manifest/index.js
+++ b/packages/kit/src/core/generate_manifest/index.js
@@ -8,6 +8,7 @@ import { compact } from '../../utils/array.js';
 import { join_relative } from '../../utils/filesystem.js';
 import { dedent } from '../sync/utils.js';
 import { find_server_assets } from './find_server_assets.js';
+import { hash } from '../../runtime/hash.js'; // TODO move this function
 import { uneval } from 'devalue';
 
 /**
@@ -100,6 +101,9 @@ export function generate_manifest({ build_data, prerendered, relative_path, rout
 				nodes: [
 					${(node_paths).map(loader).join(',\n')}
 				],
+				remotes: {
+					${build_data.manifest_data.remotes.map((filename) => `'${hash(filename)}': ${loader(join_relative(relative_path, resolve_symlinks(build_data.server_manifest, filename).chunk.file))}`).join('\n\t\t\t\t\t')}
+				},
 				routes: [
 					${routes.map(route => {
 						if (!route.page && !route.endpoint) return;
diff --git a/packages/kit/src/core/sync/create_manifest_data/index.js b/packages/kit/src/core/sync/create_manifest_data/index.js
index e0288370fd8e..314d8cd62fb9 100644
--- a/packages/kit/src/core/sync/create_manifest_data/index.js
+++ b/packages/kit/src/core/sync/create_manifest_data/index.js
@@ -4,11 +4,10 @@ import process from 'node:process';
 import colors from 'kleur';
 import { lookup } from 'mrmime';
 import { list_files, runtime_directory } from '../../utils.js';
-import { posixify, resolve_entry } from '../../../utils/filesystem.js';
+import { posixify, resolve_entry, walk } from '../../../utils/filesystem.js';
 import { parse_route_id } from '../../../utils/routing.js';
 import { sort_routes } from './sort.js';
 import { isSvelte5Plus } from '../utils.js';
-import { hash } from '../../../runtime/hash.js';
 
 /**
  * Generates the manifest data used for the client-side manifest and types generation.
@@ -28,7 +27,7 @@ export default function create_manifest_data({
 	const hooks = create_hooks(config, cwd);
 	const matchers = create_matchers(config, cwd);
 	const { nodes, routes } = create_routes_and_nodes(cwd, config, fallback);
-	const remotes = create_remotes(cwd);
+	const remotes = create_remotes(config, cwd);
 
 	for (const route of routes) {
 		for (const param of route.params) {
@@ -469,54 +468,17 @@ function create_routes_and_nodes(cwd, config, fallback) {
 }
 
 /**
+ * @param {import('types').ValidatedConfig} config
  * @param {string} cwd
  */
-function create_remotes(cwd) {
-	/**
-	 * @type {Map<string, string>}
-	 */
-	const remotes = new Map();
-
-	const valid_extensions = ['.remote.ts', '.remote.js'];
-
-	/**
-	 * @param {number} depth
-	 * @param {string} id
-	 */
-	const walk = (depth, id) => {
-		const dir = path.join(cwd, id);
-		console.log(dir);
-
-		// We can't use withFileTypes because of a NodeJs bug which returns wrong results
-		// with isDirectory() in case of symlinks: https://github.com/nodejs/node/issues/30646
-		const files = fs.readdirSync(dir).map((name) => ({
-			is_dir: fs.statSync(path.join(dir, name)).isDirectory(),
-			name
-		}));
-
-		// process files first
-		for (const file of files) {
-			if (file.is_dir) continue;
-
-			const ext = valid_extensions.find((ext) => file.name.endsWith(ext));
-			if (!ext) continue;
-			const source = fs.readFileSync(path.join(dir, file.name), 'utf-8');
-
-			remotes.set(hash(source), path.join(cwd, id, file.name));
-		}
-
-		// then handle children
-		for (const file of files) {
-			if (file.is_dir) {
-				if (file.name === 'node_modules') continue;
-				walk(depth + 1, path.posix.join(id, file.name));
-			}
-		}
-	};
+function create_remotes(config, cwd) {
+	const extensions = config.kit.moduleExtensions.map((ext) => `.remote${ext}`);
 
-	walk(0, '/');
+	const files = walk(`${cwd}/src`); // TODO could files live in other directories, including node_modules?
 
-	return remotes;
+	return files
+		.filter((file) => extensions.some((ext) => file.endsWith(ext)))
+		.map((file) => `${cwd}/src/${file}`);
 }
 
 /**
diff --git a/packages/kit/src/exports/public.d.ts b/packages/kit/src/exports/public.d.ts
index 4d37c6ecf46c..ead60551a33d 100644
--- a/packages/kit/src/exports/public.d.ts
+++ b/packages/kit/src/exports/public.d.ts
@@ -1319,7 +1319,7 @@ export interface SSRManifest {
 	_: {
 		client: NonNullable<BuildData['client']>;
 		nodes: SSRNodeLoader[];
-		remotes: Map<string, string>;
+		remotes: Record<string, () => Promise<any>>;
 		routes: SSRRoute[];
 		prerendered_routes: Set<string>;
 		matchers: () => Promise<Record<string, ParamMatcher>>;
diff --git a/packages/kit/src/exports/vite/dev/index.js b/packages/kit/src/exports/vite/dev/index.js
index 57a4e819c46b..37d47cfee7c1 100644
--- a/packages/kit/src/exports/vite/dev/index.js
+++ b/packages/kit/src/exports/vite/dev/index.js
@@ -19,6 +19,7 @@ import { not_found } from '../utils.js';
 import { SCHEME } from '../../../utils/url.js';
 import { check_feature } from '../../../utils/features.js';
 import { escape_html } from '../../../utils/escape.js';
+import { hash } from '../../../runtime/hash.js';
 
 const cwd = process.cwd();
 // vite-specifc queries that we should skip handling for css urls
@@ -248,7 +249,12 @@ export async function dev(vite, vite_config, svelte_config) {
 					};
 				}),
 				prerendered_routes: new Set(),
-				remotes: manifest_data.remotes,
+				remotes: Object.fromEntries(
+					manifest_data.remotes.map((filename) => [
+						hash(filename),
+						() => vite.ssrLoadModule(filename)
+					])
+				),
 				routes: compact(
 					manifest_data.routes.map((route) => {
 						if (!route.page && !route.endpoint) return null;
diff --git a/packages/kit/src/exports/vite/index.js b/packages/kit/src/exports/vite/index.js
index 721092a95242..87a79847b56e 100644
--- a/packages/kit/src/exports/vite/index.js
+++ b/packages/kit/src/exports/vite/index.js
@@ -609,9 +609,7 @@ Tips:
 				return;
 			}
 
-			const filename = id.replace(root, '');
-
-			return transform_client(code, filename);
+			return transform_client(code, id);
 		}
 	};
 
@@ -668,6 +666,11 @@ Tips:
 						const name = posixify(path.join('entries/matchers', key));
 						input[name] = path.resolve(file);
 					});
+
+					// ...and every .remote file
+					for (const filename of manifest_data.remotes) {
+						input[`remote/${hash(filename)}`] = filename;
+					}
 				} else if (svelte_config.kit.output.bundleStrategy !== 'split') {
 					input['bundle'] = `${runtime_directory}/client/bundle.js`;
 				} else {
diff --git a/packages/kit/src/exports/vite/remote/index.js b/packages/kit/src/exports/vite/remote/index.js
index 7beecf365c18..b6b54972914f 100644
--- a/packages/kit/src/exports/vite/remote/index.js
+++ b/packages/kit/src/exports/vite/remote/index.js
@@ -25,7 +25,7 @@ export function transform_client(code, filename) {
 	);
 
 	const s = new MagicString(code);
-	const _hash = hash(code);
+	const _hash = hash(filename);
 
 	/** @type {Visitors<ESTree.Node, null>} */
 	const visitors = {
diff --git a/packages/kit/src/runtime/server/page/rpc.js b/packages/kit/src/runtime/server/page/rpc.js
index a1ea7f34fff9..21e972c1b066 100644
--- a/packages/kit/src/runtime/server/page/rpc.js
+++ b/packages/kit/src/runtime/server/page/rpc.js
@@ -1,5 +1,5 @@
 import { negotiate } from '../../../utils/http.js';
-import { json } from '../../../exports/index.js';
+import { error, json } from '../../../exports/index.js';
 import { SvelteKitError } from '../../control.js';
 import { handle_error_and_jsonify } from '../utils.js';
 import * as devalue from 'devalue';
@@ -53,17 +53,18 @@ export async function handle_rpc_json_request(event, options, manifest) {
 	const [hash, func_name] = JSON.parse(/** @type {string} */ (event.request.headers.get('sk-rpc')));
 	const remotes = manifest._.remotes;
 
-	if (!remotes.has(hash)) {
+	if (!remotes[hash]) {
+		// TODO replace with `error`
 		return await bad_rpc(event, options);
 	}
 
-	const remote = /** @type {string} */ (remotes.get(hash));
 	let func;
 
 	try {
-		const module = await import(remote);
+		const module = await remotes[hash]();
 		func = module[func_name];
 	} catch {
+		// TODO replace with `error`
 		return await bad_rpc(event, options);
 	}
 
diff --git a/packages/kit/src/types/internal.d.ts b/packages/kit/src/types/internal.d.ts
index 05445fb8176a..e7c03363ee41 100644
--- a/packages/kit/src/types/internal.d.ts
+++ b/packages/kit/src/types/internal.d.ts
@@ -188,7 +188,7 @@ export interface ManifestData {
 		universal: string | null;
 	};
 	nodes: PageNode[];
-	remotes: Map<string, string>;
+	remotes: string[];
 	routes: RouteData[];
 	matchers: Record<string, string>;
 }

From 89894e7fcdb533bbfc52e99ed80a864fe72be69e Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 13 Mar 2025 06:51:02 -0400
Subject: [PATCH 03/24] tweak demo

---
 playgrounds/basic/src/lib/foo.remote.js   |  9 ---------
 playgrounds/basic/src/lib/foo.remote.ts   | 11 +++++++++++
 playgrounds/basic/src/routes/+page.svelte |  9 ++++++++-
 3 files changed, 19 insertions(+), 10 deletions(-)
 delete mode 100644 playgrounds/basic/src/lib/foo.remote.js
 create mode 100644 playgrounds/basic/src/lib/foo.remote.ts

diff --git a/playgrounds/basic/src/lib/foo.remote.js b/playgrounds/basic/src/lib/foo.remote.js
deleted file mode 100644
index e069a73977d4..000000000000
--- a/playgrounds/basic/src/lib/foo.remote.js
+++ /dev/null
@@ -1,9 +0,0 @@
-/**
- * @param {number} a
- * @param {number} b
- */
-export const add = (a, b) => {
-	console.log('add', a, b);
-
-	return a + b;
-};
diff --git a/playgrounds/basic/src/lib/foo.remote.ts b/playgrounds/basic/src/lib/foo.remote.ts
new file mode 100644
index 000000000000..60949e7c9562
--- /dev/null
+++ b/playgrounds/basic/src/lib/foo.remote.ts
@@ -0,0 +1,11 @@
+export const add = async (a: number, b: number) => {
+	console.log('add', a, b);
+
+	return a + b;
+};
+
+export const multiply = async (a: number, b: number) => {
+	console.log('multiply', a, b);
+
+	return a * b;
+};
diff --git a/playgrounds/basic/src/routes/+page.svelte b/playgrounds/basic/src/routes/+page.svelte
index ebb33b871751..b6b82601a434 100644
--- a/playgrounds/basic/src/routes/+page.svelte
+++ b/playgrounds/basic/src/routes/+page.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import type { PageData } from './$types';
-	import { add } from '$lib/foo.remote.js';
+	import { add, multiply } from '$lib/foo.remote.ts';
 
 	let { data }: { data: PageData } = $props();
 </script>
@@ -13,3 +13,10 @@
 		console.log(result);
 	}}>add</button
 >
+
+<button
+	onclick={async () => {
+		const result = await multiply(2, 3);
+		console.log(result);
+	}}>multiply</button
+>

From 10cd660c2d63eb50f3e13cdc22b08454e1782767 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 13 Mar 2025 06:57:57 -0400
Subject: [PATCH 04/24] fix

---
 .../kit/src/core/sync/create_manifest_data/index.js | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/packages/kit/src/core/sync/create_manifest_data/index.js b/packages/kit/src/core/sync/create_manifest_data/index.js
index 314d8cd62fb9..fafbb7339202 100644
--- a/packages/kit/src/core/sync/create_manifest_data/index.js
+++ b/packages/kit/src/core/sync/create_manifest_data/index.js
@@ -474,11 +474,14 @@ function create_routes_and_nodes(cwd, config, fallback) {
 function create_remotes(config, cwd) {
 	const extensions = config.kit.moduleExtensions.map((ext) => `.remote${ext}`);
 
-	const files = walk(`${cwd}/src`); // TODO could files live in other directories, including node_modules?
-
-	return files
-		.filter((file) => extensions.some((ext) => file.endsWith(ext)))
-		.map((file) => `${cwd}/src/${file}`);
+	// TODO could files live in other directories, including node_modules?
+	return [config.kit.files.lib, config.kit.files.routes].flatMap((dir) =>
+		fs.existsSync(dir)
+			? walk(dir)
+					.filter((file) => extensions.some((ext) => file.endsWith(ext)))
+					.map((file) => `${dir}/${file}`)
+			: []
+	);
 }
 
 /**

From 9ea9af418f3ecb93c8883528d964dedabd630b0c Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 13 Mar 2025 06:58:04 -0400
Subject: [PATCH 05/24] remove acorn-typescript

---
 packages/kit/package.json                     |  1 -
 packages/kit/src/exports/vite/remote/index.js |  7 +------
 pnpm-lock.yaml                                | 12 ------------
 3 files changed, 1 insertion(+), 19 deletions(-)

diff --git a/packages/kit/package.json b/packages/kit/package.json
index a29f9a0d0ec0..bf8fd73b9b19 100644
--- a/packages/kit/package.json
+++ b/packages/kit/package.json
@@ -30,7 +30,6 @@
 		"set-cookie-parser": "^2.6.0",
 		"sirv": "^3.0.0",
 		"acorn": "^8.12.1",
-		"@sveltejs/acorn-typescript": "^1.0.5",
 		"zimmerframe": "^1.1.2"
 	},
 	"devDependencies": {
diff --git a/packages/kit/src/exports/vite/remote/index.js b/packages/kit/src/exports/vite/remote/index.js
index b6b54972914f..fe32e57f122c 100644
--- a/packages/kit/src/exports/vite/remote/index.js
+++ b/packages/kit/src/exports/vite/remote/index.js
@@ -2,22 +2,17 @@
 /** @import * as ESTree from 'estree' */
 
 import * as acorn from 'acorn';
-import { tsPlugin } from '@sveltejs/acorn-typescript';
 import { walk } from 'zimmerframe';
 import MagicString from 'magic-string';
 import { hash } from '../../../runtime/hash.js';
 
-const ParserWithTS = acorn.Parser.extend(tsPlugin());
-
 /**
  * @param {string} code
  * @param {string} filename
  */
 export function transform_client(code, filename) {
-	const parser = filename.endsWith('.ts') ? ParserWithTS : acorn.Parser;
-
 	const ast = /** @type {ESTree.Program} */ (
-		parser.parse(code, {
+		acorn.parse(code, {
 			sourceType: 'module',
 			ecmaVersion: 13,
 			locations: true
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 5cf797e0c191..670b726e4010 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -339,9 +339,6 @@ importers:
 
   packages/kit:
     dependencies:
-      '@sveltejs/acorn-typescript':
-        specifier: ^1.0.5
-        version: 1.0.5(acorn@8.14.0)
       '@types/cookie':
         specifier: ^0.6.0
         version: 0.6.0
@@ -1968,11 +1965,6 @@ packages:
     peerDependencies:
       eslint: '>=8.40.0'
 
-  '@sveltejs/acorn-typescript@1.0.5':
-    resolution: {integrity: sha512-IwQk4yfwLdibDlrXVE04jTZYlLnwsTT2PIOQQGNLWfjavGifnk1JD1LcZjZaBTRcxZu2FfPfNLOE04DSu9lqtQ==}
-    peerDependencies:
-      acorn: ^8.9.0
-
   '@sveltejs/eslint-config@8.1.0':
     resolution: {integrity: sha512-cfgp4lPREYBjNd4ZzaP/jA85ufm7vfXiaV7h9vILXNogne80IbZRNhRCQ8XoOqTAOY/pChIzWTBuR8aDNMbAEA==}
     peerDependencies:
@@ -4350,10 +4342,6 @@ snapshots:
       eslint-visitor-keys: 4.2.0
       espree: 10.3.0
 
-  '@sveltejs/acorn-typescript@1.0.5(acorn@8.14.0)':
-    dependencies:
-      acorn: 8.14.0
-
   '@sveltejs/eslint-config@8.1.0(@stylistic/eslint-plugin-js@2.1.0(eslint@9.6.0))(eslint-config-prettier@9.1.0(eslint@9.6.0))(eslint-plugin-n@17.16.1(eslint@9.6.0)(typescript@5.6.3))(eslint-plugin-svelte@2.41.0(eslint@9.6.0)(svelte@5.2.9))(eslint@9.6.0)(typescript-eslint@8.26.0(eslint@9.6.0)(typescript@5.6.3))(typescript@5.6.3)':
     dependencies:
       '@stylistic/eslint-plugin-js': 2.1.0(eslint@9.6.0)

From 0b6eea01e56218c8040dba61529413605e59525d Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 13 Mar 2025 06:59:56 -0400
Subject: [PATCH 06/24] simplify

---
 packages/kit/src/exports/vite/index.js | 13 +------------
 1 file changed, 1 insertion(+), 12 deletions(-)

diff --git a/packages/kit/src/exports/vite/index.js b/packages/kit/src/exports/vite/index.js
index 87a79847b56e..a2cecf929575 100644
--- a/packages/kit/src/exports/vite/index.js
+++ b/packages/kit/src/exports/vite/index.js
@@ -582,21 +582,10 @@ Tips:
 		}
 	};
 
-	/**
-	 * @type {any}
-	 */
-	let root;
-
+	/** @type {import('vite').Plugin} */
 	const plugin_remote = {
 		name: 'vite-plugin-sveltekit-remote',
 
-		/**
-		 * @param {{ root: any; }} config
-		 */
-		configResolved(config) {
-			root = config.root;
-		},
-
 		/**
 		 * @param {string} code
 		 * @param {string} id

From 0fdcb1e9bbd6371666bbbbcc3100198799564d5f Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 13 Mar 2025 07:01:20 -0400
Subject: [PATCH 07/24] fix

---
 packages/kit/src/exports/vite/index.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/kit/src/exports/vite/index.js b/packages/kit/src/exports/vite/index.js
index a2cecf929575..7c28548f1d4d 100644
--- a/packages/kit/src/exports/vite/index.js
+++ b/packages/kit/src/exports/vite/index.js
@@ -592,12 +592,14 @@ Tips:
 		 * @param {any} opts
 		 */
 		transform(code, id, opts) {
-			if (!id.endsWith('.remote.js') && !id.endsWith('.remote.ts')) return;
-
 			if (opts.ssr) {
 				return;
 			}
 
+			if (!svelte_config.kit.moduleExtensions.some((ext) => id.endsWith(`.remote${ext}`))) {
+				return;
+			}
+
 			return transform_client(code, id);
 		}
 	};

From afd66e0d259e4ec125084f068ece4ff5b3a3bd2d Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 13 Mar 2025 07:14:38 -0400
Subject: [PATCH 08/24] generate, don't transform

---
 packages/kit/package.json                     |  7 +-
 packages/kit/src/exports/vite/index.js        | 36 +++++++++-
 packages/kit/src/exports/vite/remote/index.js | 67 -------------------
 pnpm-lock.yaml                                |  9 ---
 4 files changed, 36 insertions(+), 83 deletions(-)
 delete mode 100644 packages/kit/src/exports/vite/remote/index.js

diff --git a/packages/kit/package.json b/packages/kit/package.json
index bf8fd73b9b19..80763f3056c5 100644
--- a/packages/kit/package.json
+++ b/packages/kit/package.json
@@ -28,9 +28,7 @@
 		"mrmime": "^2.0.0",
 		"sade": "^1.8.1",
 		"set-cookie-parser": "^2.6.0",
-		"sirv": "^3.0.0",
-		"acorn": "^8.12.1",
-		"zimmerframe": "^1.1.2"
+		"sirv": "^3.0.0"
 	},
 	"devDependencies": {
 		"@playwright/test": "^1.44.1",
@@ -44,8 +42,7 @@
 		"svelte-preprocess": "^6.0.0",
 		"typescript": "^5.3.3",
 		"vite": "^6.0.11",
-		"vitest": "^3.0.1",
-		"@types/estree": "^1.0.5"
+		"vitest": "^3.0.1"
 	},
 	"peerDependencies": {
 		"@sveltejs/vite-plugin-svelte": "^3.0.0 || ^4.0.0-next.1 || ^5.0.0",
diff --git a/packages/kit/src/exports/vite/index.js b/packages/kit/src/exports/vite/index.js
index 7c28548f1d4d..8ea33e795ed5 100644
--- a/packages/kit/src/exports/vite/index.js
+++ b/packages/kit/src/exports/vite/index.js
@@ -36,7 +36,6 @@ import {
 } from './module_ids.js';
 import { resolve_peer_dependency } from '../../utils/import.js';
 import { compact } from '../../utils/array.js';
-import { transform_client } from './remote/index.js';
 
 const cwd = process.cwd();
 
@@ -600,7 +599,40 @@ Tips:
 				return;
 			}
 
-			return transform_client(code, id);
+			/** @type {string[]} */
+			const names = [];
+			const program = this.parse(code);
+
+			for (const node of program.body) {
+				if (node.type === 'ExportNamedDeclaration') {
+					for (const specifier of node.specifiers) {
+						names.push(/** @type {{ name: string }} */ (specifier.exported).name);
+					}
+
+					if (node.declaration) {
+						if (node.declaration.type === 'FunctionDeclaration') {
+							names.push(node.declaration.id.name);
+						} else if (node.declaration.type === 'VariableDeclaration') {
+							for (const declarator of node.declaration.declarations) {
+								if (declarator.id.type !== 'Identifier') {
+									throw new Error('TODO');
+								}
+
+								names.push(declarator.id.name);
+							}
+						}
+					}
+				}
+			}
+
+			const h = hash(id);
+			const exports = names.map(
+				(n) => `export const ${n} = (...args) => remote_call('${h}', '${n}', args);`
+			);
+
+			return {
+				code: `import { remote_call } from '__sveltekit/remote';\n\n${exports.join('\n')}\n`
+			};
 		}
 	};
 
diff --git a/packages/kit/src/exports/vite/remote/index.js b/packages/kit/src/exports/vite/remote/index.js
deleted file mode 100644
index fe32e57f122c..000000000000
--- a/packages/kit/src/exports/vite/remote/index.js
+++ /dev/null
@@ -1,67 +0,0 @@
-/** @import { Visitors } from 'zimmerframe' */
-/** @import * as ESTree from 'estree' */
-
-import * as acorn from 'acorn';
-import { walk } from 'zimmerframe';
-import MagicString from 'magic-string';
-import { hash } from '../../../runtime/hash.js';
-
-/**
- * @param {string} code
- * @param {string} filename
- */
-export function transform_client(code, filename) {
-	const ast = /** @type {ESTree.Program} */ (
-		acorn.parse(code, {
-			sourceType: 'module',
-			ecmaVersion: 13,
-			locations: true
-		})
-	);
-
-	const s = new MagicString(code);
-	const _hash = hash(filename);
-
-	/** @type {Visitors<ESTree.Node, null>} */
-	const visitors = {
-		ExportNamedDeclaration(node, context) {
-			const declaration = node.declaration;
-
-			if (declaration?.type === 'FunctionDeclaration') {
-				const name = declaration.id.name;
-				s.update(
-					// @ts-ignore
-					declaration.start,
-					// @ts-ignore
-					declaration.end,
-					`async function ${name}(...args) { return await remote_call('${_hash}', '${name}', args); }`
-				);
-			} else if (declaration?.type === 'VariableDeclaration') {
-				for (const declarator of declaration.declarations) {
-					const id = declarator.id;
-					if (id.type == 'Identifier') {
-						s.update(
-							// @ts-ignore
-							declarator.start,
-							// @ts-ignore
-							declarator.end,
-							`${id.name} = async (...args) => { return await remote_call('${_hash}', '${id.name}', args); }`
-						);
-					} else {
-						// TODO: do we throw an error here?
-					}
-				}
-			} else {
-				// TODO: do we throw an error here?
-			}
-
-			context.next();
-		}
-	};
-
-	walk(ast, null, visitors);
-
-	s.prepend("import { remote_call } from '__sveltekit/remote';");
-
-	return s.toString();
-}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 670b726e4010..f0301292918b 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -342,9 +342,6 @@ importers:
       '@types/cookie':
         specifier: ^0.6.0
         version: 0.6.0
-      acorn:
-        specifier: ^8.12.1
-        version: 8.14.0
       cookie:
         specifier: ^0.6.0
         version: 0.6.0
@@ -375,9 +372,6 @@ importers:
       sirv:
         specifier: ^3.0.0
         version: 3.0.0
-      zimmerframe:
-        specifier: ^1.1.2
-        version: 1.1.2
     devDependencies:
       '@playwright/test':
         specifier: ^1.44.1
@@ -388,9 +382,6 @@ importers:
       '@types/connect':
         specifier: ^3.4.38
         version: 3.4.38
-      '@types/estree':
-        specifier: ^1.0.5
-        version: 1.0.6
       '@types/node':
         specifier: ^18.19.48
         version: 18.19.50

From c3a46513e75eb0f884daf8c0104ac9b4b79a2bad Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 13 Mar 2025 07:16:19 -0400
Subject: [PATCH 09/24] use an x- header

---
 packages/kit/src/runtime/client/client.js   | 2 +-
 packages/kit/src/runtime/server/page/rpc.js | 6 ++++--
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/kit/src/runtime/client/client.js b/packages/kit/src/runtime/client/client.js
index bbebb1ab7873..455458d6543b 100644
--- a/packages/kit/src/runtime/client/client.js
+++ b/packages/kit/src/runtime/client/client.js
@@ -2967,7 +2967,7 @@ export async function remote_call(hash, func_name, args) {
 		body,
 		headers: {
 			'Content-Type': 'application/json',
-			'sk-rpc': JSON.stringify([hash, func_name])
+			'x-sveltekit-remote': JSON.stringify([hash, func_name])
 		}
 	});
 
diff --git a/packages/kit/src/runtime/server/page/rpc.js b/packages/kit/src/runtime/server/page/rpc.js
index 21e972c1b066..333684cfb2ab 100644
--- a/packages/kit/src/runtime/server/page/rpc.js
+++ b/packages/kit/src/runtime/server/page/rpc.js
@@ -6,7 +6,7 @@ import * as devalue from 'devalue';
 
 /** @param {import('@sveltejs/kit').RequestEvent} event */
 export function is_rpc_json_request(event) {
-	const rpc_data = event.request.headers.get('sk-rpc');
+	const rpc_data = event.request.headers.get('x-sveltekit-remote');
 
 	if (rpc_data == null) return false;
 	const json = JSON.parse(rpc_data);
@@ -50,7 +50,9 @@ async function bad_rpc(event, options) {
  * @param {import('@sveltejs/kit').SSRManifest} manifest
  */
 export async function handle_rpc_json_request(event, options, manifest) {
-	const [hash, func_name] = JSON.parse(/** @type {string} */ (event.request.headers.get('sk-rpc')));
+	const [hash, func_name] = JSON.parse(
+		/** @type {string} */ (event.request.headers.get('x-sveltekit-remote'))
+	);
 	const remotes = manifest._.remotes;
 
 	if (!remotes[hash]) {

From b49d381b51ccf30faafb510e2c664e8d87e66044 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 13 Mar 2025 07:19:42 -0400
Subject: [PATCH 10/24] regenerate manifest when remote files are added/removed

---
 packages/kit/src/exports/vite/dev/index.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/kit/src/exports/vite/dev/index.js b/packages/kit/src/exports/vite/dev/index.js
index 37d47cfee7c1..ac009a77b19f 100644
--- a/packages/kit/src/exports/vite/dev/index.js
+++ b/packages/kit/src/exports/vite/dev/index.js
@@ -320,6 +320,7 @@ export async function dev(vite, vite_config, svelte_config) {
 			if (
 				file.startsWith(svelte_config.kit.files.routes + path.sep) ||
 				file.startsWith(svelte_config.kit.files.params + path.sep) ||
+				svelte_config.kit.moduleExtensions.some((ext) => file.endsWith(`.remote${ext}`)) ||
 				// in contrast to server hooks, client hooks are written to the client manifest
 				// and therefore need rebuilding when they are added/removed
 				file.startsWith(svelte_config.kit.files.hooks.client)

From e5fbb1c6ab995295a7d43a3219545d1cb351d5af Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 13 Mar 2025 08:02:47 -0400
Subject: [PATCH 11/24] move RPC logic out of page, it belongs elsewhere

---
 packages/kit/src/runtime/server/page/index.js                | 5 -----
 .../kit/src/runtime/server/{page/rpc.js => remote/index.js}  | 2 +-
 packages/kit/src/runtime/server/respond.js                   | 5 +++++
 3 files changed, 6 insertions(+), 6 deletions(-)
 rename packages/kit/src/runtime/server/{page/rpc.js => remote/index.js} (98%)

diff --git a/packages/kit/src/runtime/server/page/index.js b/packages/kit/src/runtime/server/page/index.js
index e19dee72da0d..01337e4cac1c 100644
--- a/packages/kit/src/runtime/server/page/index.js
+++ b/packages/kit/src/runtime/server/page/index.js
@@ -15,7 +15,6 @@ import { render_response } from './render.js';
 import { respond_with_error } from './respond_with_error.js';
 import { get_data_json } from '../data/index.js';
 import { DEV } from 'esm-env';
-import { handle_rpc_json_request, is_rpc_json_request } from './rpc.js';
 
 /**
  * The maximum request depth permitted before assuming we're stuck in an infinite loop
@@ -40,10 +39,6 @@ export async function render_page(event, page, options, manifest, state, nodes,
 		});
 	}
 
-	if (is_rpc_json_request(event)) {
-		return await handle_rpc_json_request(event, options, manifest);
-	}
-
 	if (is_action_json_request(event)) {
 		const node = await manifest._.nodes[page.leaf]();
 		return handle_action_json_request(event, options, node?.server);
diff --git a/packages/kit/src/runtime/server/page/rpc.js b/packages/kit/src/runtime/server/remote/index.js
similarity index 98%
rename from packages/kit/src/runtime/server/page/rpc.js
rename to packages/kit/src/runtime/server/remote/index.js
index 333684cfb2ab..51ce840dc47a 100644
--- a/packages/kit/src/runtime/server/page/rpc.js
+++ b/packages/kit/src/runtime/server/remote/index.js
@@ -1,5 +1,5 @@
 import { negotiate } from '../../../utils/http.js';
-import { error, json } from '../../../exports/index.js';
+import { json } from '../../../exports/index.js';
 import { SvelteKitError } from '../../control.js';
 import { handle_error_and_jsonify } from '../utils.js';
 import * as devalue from 'devalue';
diff --git a/packages/kit/src/runtime/server/respond.js b/packages/kit/src/runtime/server/respond.js
index 08e142a3ce39..e945a75b6c6e 100644
--- a/packages/kit/src/runtime/server/respond.js
+++ b/packages/kit/src/runtime/server/respond.js
@@ -26,6 +26,7 @@ import {
 	strip_data_suffix,
 	strip_resolution_suffix
 } from '../pathname.js';
+import { handle_rpc_json_request, is_rpc_json_request } from './remote/index.js';
 
 /* global __SVELTEKIT_ADAPTER_NAME__ */
 /* global __SVELTEKIT_DEV__ */
@@ -423,6 +424,10 @@ export async function respond(request, options, manifest, state) {
 				});
 			}
 
+			if (is_rpc_json_request(event)) {
+				return handle_rpc_json_request(event, options, manifest);
+			}
+
 			if (route) {
 				const method = /** @type {import('types').HttpMethod} */ (event.request.method);
 

From c6271ec18a94e1925124fc4ebbfbbc4a91c11587 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 13 Mar 2025 08:09:58 -0400
Subject: [PATCH 12/24] use _app/remote/x

---
 packages/kit/src/runtime/client/client.js     | 10 ++++----
 .../kit/src/runtime/server/remote/index.js    | 23 ++++---------------
 packages/kit/src/runtime/server/respond.js    |  9 ++++----
 3 files changed, 14 insertions(+), 28 deletions(-)

diff --git a/packages/kit/src/runtime/client/client.js b/packages/kit/src/runtime/client/client.js
index 455458d6543b..d28c54ca462a 100644
--- a/packages/kit/src/runtime/client/client.js
+++ b/packages/kit/src/runtime/client/client.js
@@ -22,7 +22,7 @@ import {
 	create_updated_store,
 	load_css
 } from './utils.js';
-import { base } from '__sveltekit/paths';
+import { app_dir, base } from '__sveltekit/paths';
 import * as devalue from 'devalue';
 import {
 	HISTORY_INDEX,
@@ -2960,14 +2960,12 @@ export async function remote_call(hash, func_name, args) {
 	const encoders = Object.fromEntries(
 		Object.entries(transport).map(([key, value]) => [key, value.encode])
 	);
-	const body = devalue.stringify(args, encoders);
 
-	const response = await fetch('/remote', {
+	const response = await fetch(`/${app_dir}/remote/${hash}/${func_name}`, {
 		method: 'POST',
-		body,
+		body: devalue.stringify(args, encoders), // TODO maybe don't use devalue.stringify here
 		headers: {
-			'Content-Type': 'application/json',
-			'x-sveltekit-remote': JSON.stringify([hash, func_name])
+			'Content-Type': 'application/json'
 		}
 	});
 
diff --git a/packages/kit/src/runtime/server/remote/index.js b/packages/kit/src/runtime/server/remote/index.js
index 51ce840dc47a..8e65af4fce2d 100644
--- a/packages/kit/src/runtime/server/remote/index.js
+++ b/packages/kit/src/runtime/server/remote/index.js
@@ -1,21 +1,8 @@
-import { negotiate } from '../../../utils/http.js';
 import { json } from '../../../exports/index.js';
 import { SvelteKitError } from '../../control.js';
 import { handle_error_and_jsonify } from '../utils.js';
 import * as devalue from 'devalue';
-
-/** @param {import('@sveltejs/kit').RequestEvent} event */
-export function is_rpc_json_request(event) {
-	const rpc_data = event.request.headers.get('x-sveltekit-remote');
-
-	if (rpc_data == null) return false;
-	const json = JSON.parse(rpc_data);
-	if (!Array.isArray(json) || json.length !== 2) return false;
-
-	const accept = negotiate(event.request.headers.get('accept') ?? '*/*', ['application/json']);
-
-	return accept === 'application/json' && event.request.method === 'POST';
-}
+import { app_dir } from '__sveltekit/paths';
 
 /**
  * @param {import('@sveltejs/kit').RequestEvent} event
@@ -49,10 +36,10 @@ async function bad_rpc(event, options) {
  * @param {import('types').SSROptions} options
  * @param {import('@sveltejs/kit').SSRManifest} manifest
  */
-export async function handle_rpc_json_request(event, options, manifest) {
-	const [hash, func_name] = JSON.parse(
-		/** @type {string} */ (event.request.headers.get('x-sveltekit-remote'))
-	);
+export async function handle_remote_call(event, options, manifest) {
+	const id = event.url.pathname.replace(`/${app_dir}/remote/`, '');
+
+	const [hash, func_name] = id.split('/');
 	const remotes = manifest._.remotes;
 
 	if (!remotes[hash]) {
diff --git a/packages/kit/src/runtime/server/respond.js b/packages/kit/src/runtime/server/respond.js
index e945a75b6c6e..d58bf61f8d0e 100644
--- a/packages/kit/src/runtime/server/respond.js
+++ b/packages/kit/src/runtime/server/respond.js
@@ -26,7 +26,7 @@ import {
 	strip_data_suffix,
 	strip_resolution_suffix
 } from '../pathname.js';
-import { handle_rpc_json_request, is_rpc_json_request } from './remote/index.js';
+import { handle_remote_call, is_rpc_json_request } from './remote/index.js';
 
 /* global __SVELTEKIT_ADAPTER_NAME__ */
 /* global __SVELTEKIT_DEV__ */
@@ -89,6 +89,7 @@ export async function respond(request, options, manifest, state) {
 	 */
 	const is_route_resolution_request = has_resolution_suffix(url.pathname);
 	const is_data_request = has_data_suffix(url.pathname);
+	const is_remote_request = url.pathname.startsWith(`/${app_dir}/remote/`);
 
 	if (is_route_resolution_request) {
 		url.pathname = strip_resolution_suffix(url.pathname);
@@ -210,7 +211,7 @@ export async function respond(request, options, manifest, state) {
 		return get_public_env(request);
 	}
 
-	if (resolved_path.startsWith(`/${app_dir}`)) {
+	if (!is_remote_request && resolved_path.startsWith(`/${app_dir}`)) {
 		// Ensure that 404'd static assets are not cached - some adapters might apply caching by default
 		const headers = new Headers();
 		headers.set('cache-control', 'public, max-age=0, must-revalidate');
@@ -424,8 +425,8 @@ export async function respond(request, options, manifest, state) {
 				});
 			}
 
-			if (is_rpc_json_request(event)) {
-				return handle_rpc_json_request(event, options, manifest);
+			if (is_remote_request) {
+				return handle_remote_call(event, options, manifest);
 			}
 
 			if (route) {

From 9b3cb3d95afb2e5101a927e1927556d6145ddcbc Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 13 Mar 2025 08:41:29 -0400
Subject: [PATCH 13/24] tighten up error handling

---
 packages/kit/src/runtime/client/client.js     | 10 +++-
 .../kit/src/runtime/server/remote/index.js    | 58 ++-----------------
 2 files changed, 13 insertions(+), 55 deletions(-)

diff --git a/packages/kit/src/runtime/client/client.js b/packages/kit/src/runtime/client/client.js
index d28c54ca462a..0eeb2e7672b1 100644
--- a/packages/kit/src/runtime/client/client.js
+++ b/packages/kit/src/runtime/client/client.js
@@ -2969,8 +2969,12 @@ export async function remote_call(hash, func_name, args) {
 		}
 	});
 
-	const json = await response.text();
-	const parsed = JSON.parse(json);
+	const result = await response.json();
 
-	return devalue.parse(parsed.data, app.decoders);
+	if (!response.ok) {
+		// TODO should this go through `handleError`?
+		throw new Error(result.message);
+	}
+
+	return devalue.parse(result.data, app.decoders);
 }
diff --git a/packages/kit/src/runtime/server/remote/index.js b/packages/kit/src/runtime/server/remote/index.js
index 8e65af4fce2d..fb30701439b8 100644
--- a/packages/kit/src/runtime/server/remote/index.js
+++ b/packages/kit/src/runtime/server/remote/index.js
@@ -1,35 +1,7 @@
 import { json } from '../../../exports/index.js';
-import { SvelteKitError } from '../../control.js';
-import { handle_error_and_jsonify } from '../utils.js';
 import * as devalue from 'devalue';
 import { app_dir } from '__sveltekit/paths';
-
-/**
- * @param {import('@sveltejs/kit').RequestEvent} event
- * @param {import("types").SSROptions} options
- */
-async function bad_rpc(event, options) {
-	const bad_rpc = new SvelteKitError(
-		405,
-		'Method Not Allowed',
-		'POST method not allowed for this remote procedure call'
-	);
-
-	return json(
-		{
-			type: 'error',
-			error: await handle_error_and_jsonify(event, options, bad_rpc)
-		},
-		{
-			status: bad_rpc.status,
-			headers: {
-				// https://developer.mozilla.org/en-US/docs/Web/HTTP/Status/405
-				// "The server must generate an Allow header field in a 405 status code response"
-				allow: 'GET'
-			}
-		}
-	);
-}
+import { error } from 'console';
 
 /**
  * @param {import('@sveltejs/kit').RequestEvent} event
@@ -42,36 +14,18 @@ export async function handle_remote_call(event, options, manifest) {
 	const [hash, func_name] = id.split('/');
 	const remotes = manifest._.remotes;
 
-	if (!remotes[hash]) {
-		// TODO replace with `error`
-		return await bad_rpc(event, options);
-	}
+	if (!remotes[hash]) error(404);
 
-	let func;
+	const module = await remotes[hash]();
+	const func = module[func_name];
 
-	try {
-		const module = await remotes[hash]();
-		func = module[func_name];
-	} catch {
-		// TODO replace with `error`
-		return await bad_rpc(event, options);
-	}
+	if (!func) error(404);
 
 	const transport = options.hooks.transport;
 	const args_json = await event.request.text();
 	const decoders = Object.fromEntries(Object.entries(transport).map(([k, v]) => [k, v.decode]));
 	const args = devalue.parse(args_json, decoders);
-	let data;
-
-	try {
-		data = await func.apply(null, args);
-	} catch (/** @type {any} */ e) {
-		return json({
-			type: 'error',
-			status: 500,
-			error: await handle_error_and_jsonify(event, options, e)
-		});
-	}
+	const data = await func.apply(null, args);
 
 	return json({
 		type: 'success',

From ed95600e636fe5690890e9ade1a8557ea27640a6 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 13 Mar 2025 08:52:51 -0400
Subject: [PATCH 14/24] unused

---
 packages/kit/src/runtime/server/respond.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/kit/src/runtime/server/respond.js b/packages/kit/src/runtime/server/respond.js
index d58bf61f8d0e..3c041d08fd5c 100644
--- a/packages/kit/src/runtime/server/respond.js
+++ b/packages/kit/src/runtime/server/respond.js
@@ -26,7 +26,7 @@ import {
 	strip_data_suffix,
 	strip_resolution_suffix
 } from '../pathname.js';
-import { handle_remote_call, is_rpc_json_request } from './remote/index.js';
+import { handle_remote_call } from './remote/index.js';
 
 /* global __SVELTEKIT_ADAPTER_NAME__ */
 /* global __SVELTEKIT_DEV__ */

From e61faeee826c1993474d48f5f142adade64072e7 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 13 Mar 2025 09:02:58 -0400
Subject: [PATCH 15/24] CSRF

---
 packages/kit/src/runtime/server/respond.js | 41 +++++++++++++---------
 1 file changed, 24 insertions(+), 17 deletions(-)

diff --git a/packages/kit/src/runtime/server/respond.js b/packages/kit/src/runtime/server/respond.js
index 3c041d08fd5c..d8360e227886 100644
--- a/packages/kit/src/runtime/server/respond.js
+++ b/packages/kit/src/runtime/server/respond.js
@@ -55,24 +55,35 @@ export async function respond(request, options, manifest, state) {
 	/** URL but stripped from the potential `/__data.json` suffix and its search param  */
 	const url = new URL(request.url);
 
-	if (options.csrf_check_origin) {
+	const is_route_resolution_request = has_resolution_suffix(url.pathname);
+	const is_data_request = has_data_suffix(url.pathname);
+	const is_remote_request = url.pathname.startsWith(`/${app_dir}/remote/`);
+
+	if (options.csrf_check_origin && request.headers.get('origin') !== url.origin) {
+		const opts = { status: 403 };
+
+		if (is_remote_request) {
+			return json(
+				{
+					message: 'Cross-site remote requests are forbidden'
+				},
+				opts
+			);
+		}
+
 		const forbidden =
 			is_form_content_type(request) &&
 			(request.method === 'POST' ||
 				request.method === 'PUT' ||
 				request.method === 'PATCH' ||
-				request.method === 'DELETE') &&
-			request.headers.get('origin') !== url.origin;
+				request.method === 'DELETE');
 
 		if (forbidden) {
-			const csrf_error = new HttpError(
-				403,
-				`Cross-site ${request.method} form submissions are forbidden`
-			);
+			const message = `Cross-site ${request.method} form submissions are forbidden`;
 			if (request.headers.get('accept') === 'application/json') {
-				return json(csrf_error.body, { status: csrf_error.status });
+				return json({ message }, opts);
 			}
-			return text(csrf_error.body.message, { status: csrf_error.status });
+			return text(message, opts);
 		}
 	}
 
@@ -83,15 +94,11 @@ export async function respond(request, options, manifest, state) {
 	/** @type {boolean[] | undefined} */
 	let invalidated_data_nodes;
 
-	/**
-	 * If the request is for a route resolution, first modify the URL, then continue as normal
-	 * for path resolution, then return the route object as a JS file.
-	 */
-	const is_route_resolution_request = has_resolution_suffix(url.pathname);
-	const is_data_request = has_data_suffix(url.pathname);
-	const is_remote_request = url.pathname.startsWith(`/${app_dir}/remote/`);
-
 	if (is_route_resolution_request) {
+		/**
+		 * If the request is for a route resolution, first modify the URL, then continue as normal
+		 * for path resolution, then return the route object as a JS file.
+		 */
 		url.pathname = strip_resolution_suffix(url.pathname);
 	} else if (is_data_request) {
 		url.pathname =

From e504a8bf23dcb03386a6adc636caa239f6da61b5 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 13 Mar 2025 09:04:42 -0400
Subject: [PATCH 16/24] smaller payloads

---
 packages/kit/src/runtime/client/client.js       | 2 +-
 packages/kit/src/runtime/server/remote/index.js | 6 ++----
 2 files changed, 3 insertions(+), 5 deletions(-)

diff --git a/packages/kit/src/runtime/client/client.js b/packages/kit/src/runtime/client/client.js
index 0eeb2e7672b1..974151633b99 100644
--- a/packages/kit/src/runtime/client/client.js
+++ b/packages/kit/src/runtime/client/client.js
@@ -2976,5 +2976,5 @@ export async function remote_call(hash, func_name, args) {
 		throw new Error(result.message);
 	}
 
-	return devalue.parse(result.data, app.decoders);
+	return devalue.parse(result, app.decoders);
 }
diff --git a/packages/kit/src/runtime/server/remote/index.js b/packages/kit/src/runtime/server/remote/index.js
index fb30701439b8..5186756bd787 100644
--- a/packages/kit/src/runtime/server/remote/index.js
+++ b/packages/kit/src/runtime/server/remote/index.js
@@ -27,10 +27,8 @@ export async function handle_remote_call(event, options, manifest) {
 	const args = devalue.parse(args_json, decoders);
 	const data = await func.apply(null, args);
 
-	return json({
-		type: 'success',
-		status: data ? 200 : 204,
-		data: stringify_rpc_response(data, transport)
+	return json(stringify_rpc_response(data, transport), {
+		status: data ? 200 : 204
 	});
 }
 

From 939cd499019a3d87a00c48751d1d74e38c0ff64f Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 14 Mar 2025 08:56:32 -0400
Subject: [PATCH 17/24] belt and braces

---
 packages/kit/src/exports/vite/index.js | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/packages/kit/src/exports/vite/index.js b/packages/kit/src/exports/vite/index.js
index 8ea33e795ed5..5cebe68101e4 100644
--- a/packages/kit/src/exports/vite/index.js
+++ b/packages/kit/src/exports/vite/index.js
@@ -625,13 +625,21 @@ Tips:
 				}
 			}
 
+			let fn = 'remote_call';
+
+			// belt and braces — guard against an existing `export function remote_call() {...}`
+			let n = 1;
+			while (names.includes(fn)) fn = `remote_call$${n++}`;
+
 			const h = hash(id);
 			const exports = names.map(
-				(n) => `export const ${n} = (...args) => remote_call('${h}', '${n}', args);`
+				(n) => `export const ${n} = (...args) => ${fn}('${h}', '${n}', args);`
 			);
 
+			const specifier = fn === 'remote_call' ? fn : `remote_call as ${fn}`;
+
 			return {
-				code: `import { remote_call } from '__sveltekit/remote';\n\n${exports.join('\n')}\n`
+				code: `import { ${specifier} } from '__sveltekit/remote';\n\n${exports.join('\n')}\n`
 			};
 		}
 	};

From d0a123496879f08d078ea148ad4027c7168f19d3 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 14 Mar 2025 08:57:29 -0400
Subject: [PATCH 18/24] don't use 204, that only applies to DELETE/PUT requests

---
 packages/kit/src/runtime/server/remote/index.js | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/packages/kit/src/runtime/server/remote/index.js b/packages/kit/src/runtime/server/remote/index.js
index 5186756bd787..ef897240721d 100644
--- a/packages/kit/src/runtime/server/remote/index.js
+++ b/packages/kit/src/runtime/server/remote/index.js
@@ -27,9 +27,7 @@ export async function handle_remote_call(event, options, manifest) {
 	const args = devalue.parse(args_json, decoders);
 	const data = await func.apply(null, args);
 
-	return json(stringify_rpc_response(data, transport), {
-		status: data ? 200 : 204
-	});
+	return json(stringify_rpc_response(data, transport));
 }
 
 /**

From bfe200cacb25ad00f4fa4917ff12257063a53f41 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 14 Mar 2025 09:02:00 -0400
Subject: [PATCH 19/24] turn remote_call into a factory - more compact and
 gives us a lot more options

---
 packages/kit/src/exports/vite/index.js    | 12 +++----
 packages/kit/src/runtime/client/client.js | 42 +++++++++++------------
 2 files changed, 26 insertions(+), 28 deletions(-)

diff --git a/packages/kit/src/exports/vite/index.js b/packages/kit/src/exports/vite/index.js
index 5cebe68101e4..4fef5cdde227 100644
--- a/packages/kit/src/exports/vite/index.js
+++ b/packages/kit/src/exports/vite/index.js
@@ -625,18 +625,16 @@ Tips:
 				}
 			}
 
-			let fn = 'remote_call';
+			let fn = 'remote';
 
-			// belt and braces — guard against an existing `export function remote_call() {...}`
+			// belt and braces — guard against an existing `export function remote() {...}`
 			let n = 1;
-			while (names.includes(fn)) fn = `remote_call$${n++}`;
+			while (names.includes(fn)) fn = `remote$${n++}`;
 
 			const h = hash(id);
-			const exports = names.map(
-				(n) => `export const ${n} = (...args) => ${fn}('${h}', '${n}', args);`
-			);
+			const exports = names.map((n) => `export const ${n} = ${fn}('${h}/${n}');`);
 
-			const specifier = fn === 'remote_call' ? fn : `remote_call as ${fn}`;
+			const specifier = fn === 'remote' ? fn : `remote as ${fn}`;
 
 			return {
 				code: `import { ${specifier} } from '__sveltekit/remote';\n\n${exports.join('\n')}\n`
diff --git a/packages/kit/src/runtime/client/client.js b/packages/kit/src/runtime/client/client.js
index 974151633b99..78843bfcd900 100644
--- a/packages/kit/src/runtime/client/client.js
+++ b/packages/kit/src/runtime/client/client.js
@@ -2951,30 +2951,30 @@ if (DEV) {
 }
 
 /**
- * @param {string} hash
- * @param {string} func_name
- * @param {any} args
+ * @param {string} id
  */
-export async function remote_call(hash, func_name, args) {
-	const transport = app.hooks.transport;
-	const encoders = Object.fromEntries(
-		Object.entries(transport).map(([key, value]) => [key, value.encode])
-	);
+export function remote(id) {
+	return async (/** @type {any} */ ...args) => {
+		const transport = app.hooks.transport;
+		const encoders = Object.fromEntries(
+			Object.entries(transport).map(([key, value]) => [key, value.encode])
+		);
 
-	const response = await fetch(`/${app_dir}/remote/${hash}/${func_name}`, {
-		method: 'POST',
-		body: devalue.stringify(args, encoders), // TODO maybe don't use devalue.stringify here
-		headers: {
-			'Content-Type': 'application/json'
-		}
-	});
+		const response = await fetch(`/${app_dir}/remote/${id}`, {
+			method: 'POST',
+			body: devalue.stringify(args, encoders), // TODO maybe don't use devalue.stringify here
+			headers: {
+				'Content-Type': 'application/json'
+			}
+		});
 
-	const result = await response.json();
+		const result = await response.json();
 
-	if (!response.ok) {
-		// TODO should this go through `handleError`?
-		throw new Error(result.message);
-	}
+		if (!response.ok) {
+			// TODO should this go through `handleError`?
+			throw new Error(result.message);
+		}
 
-	return devalue.parse(result, app.decoders);
+		return devalue.parse(result, app.decoders);
+	};
 }

From c37964edf38d364fe01dc1981962ada06b76906e Mon Sep 17 00:00:00 2001
From: Simon Holthausen <simon.holthausen@vercel.com>
Date: Sat, 22 Mar 2025 17:41:49 +0100
Subject: [PATCH 20/24] analyze exports of remotes dynamically, add
 query/action/formAction as different types of remotes

---
 packages/kit/src/core/postbuild/analyse.js    |  14 +-
 .../core/sync/create_manifest_data/index.js   |   2 +-
 packages/kit/src/exports/index.js             |  71 ++++++++++
 packages/kit/src/exports/public.d.ts          |   1 +
 .../src/exports/vite/build/build_remotes.js   |  44 ++++++
 packages/kit/src/exports/vite/index.js        | 134 +++++++++++++-----
 packages/kit/src/runtime/client/client.js     |  36 ++++-
 .../kit/src/runtime/server/remote/index.js    |  34 ++++-
 packages/kit/src/runtime/server/respond.js    |  42 +++---
 packages/kit/src/types/internal.d.ts          |   2 +
 packages/kit/types/index.d.ts                 |   9 ++
 11 files changed, 331 insertions(+), 58 deletions(-)
 create mode 100644 packages/kit/src/exports/vite/build/build_remotes.js

diff --git a/packages/kit/src/core/postbuild/analyse.js b/packages/kit/src/core/postbuild/analyse.js
index 25bd403f1eb8..5d8c9e10346b 100644
--- a/packages/kit/src/core/postbuild/analyse.js
+++ b/packages/kit/src/core/postbuild/analyse.js
@@ -61,7 +61,8 @@ async function analyse({
 	/** @type {import('types').ServerMetadata} */
 	const metadata = {
 		nodes: [],
-		routes: new Map()
+		routes: new Map(),
+		remotes: new Map()
 	};
 
 	const nodes = await Promise.all(manifest._.nodes.map((loader) => loader()));
@@ -143,6 +144,17 @@ async function analyse({
 		});
 	}
 
+	// analyse remotes
+	for (const remote of Object.keys(manifest._.remotes)) {
+		const modules = await manifest._.remotes[remote]();
+		const exports = new Map();
+		for (const [name, value] of Object.entries(modules)) {
+			const type = value.__type ?? 'other';
+			exports.set(type, (exports.get(type) ?? []).concat(name));
+		}
+		metadata.remotes.set(remote, exports);
+	}
+
 	return metadata;
 }
 
diff --git a/packages/kit/src/core/sync/create_manifest_data/index.js b/packages/kit/src/core/sync/create_manifest_data/index.js
index fafbb7339202..ae10597b529a 100644
--- a/packages/kit/src/core/sync/create_manifest_data/index.js
+++ b/packages/kit/src/core/sync/create_manifest_data/index.js
@@ -479,7 +479,7 @@ function create_remotes(config, cwd) {
 		fs.existsSync(dir)
 			? walk(dir)
 					.filter((file) => extensions.some((ext) => file.endsWith(ext)))
-					.map((file) => `${dir}/${file}`)
+					.map((file) => posixify(`${dir}/${file}`))
 			: []
 	);
 }
diff --git a/packages/kit/src/exports/index.js b/packages/kit/src/exports/index.js
index 4d2bb75223f3..4ed2b9c9fa2e 100644
--- a/packages/kit/src/exports/index.js
+++ b/packages/kit/src/exports/index.js
@@ -262,3 +262,74 @@ export function normalizeUrl(url) {
 		}
 	};
 }
+
+/**
+ * @template {(formData: FormData) => any} T
+ * @param {T} fn
+ * @returns {T}
+ */
+export function formAction(fn) {
+	// Better safe than sorry: Seal these properties to prevent modification
+	Object.defineProperty(fn, 'method', {
+		value: 'POST',
+		writable: false,
+		enumerable: true,
+		configurable: false
+	});
+	Object.defineProperty(fn, '__type', {
+		value: 'formAction',
+		writable: false,
+		enumerable: true,
+		configurable: false
+	});
+	let set = false;
+	Object.defineProperty(fn, '_set_action', {
+		/** @param {string} action */
+		value: (action) => {
+			if (set) return;
+			set = true;
+			Object.defineProperty(fn, 'action', {
+				value: action,
+				writable: false,
+				enumerable: true,
+				configurable: false
+			});
+		},
+		writable: false,
+		enumerable: true,
+		configurable: false
+	});
+	return fn;
+}
+
+/**
+ * @template {(...args: any[]) => any} T
+ * @param {T} fn
+ * @returns {T}
+ */
+export function query(fn) {
+	// Better safe than sorry: Seal these properties to prevent modification
+	Object.defineProperty(fn, '__type', {
+		value: 'query',
+		writable: false,
+		enumerable: true,
+		configurable: false
+	});
+	return fn;
+}
+
+/**
+ * @template {(...args: any[]) => any} T
+ * @param {T} fn
+ * @returns {T}
+ */
+export function action(fn) {
+	// Better safe than sorry: Seal these properties to prevent modification
+	Object.defineProperty(fn, '__type', {
+		value: 'action',
+		writable: false,
+		enumerable: true,
+		configurable: false
+	});
+	return fn;
+}
diff --git a/packages/kit/src/exports/public.d.ts b/packages/kit/src/exports/public.d.ts
index 5af83b9495ad..1a566e4f9720 100644
--- a/packages/kit/src/exports/public.d.ts
+++ b/packages/kit/src/exports/public.d.ts
@@ -1324,6 +1324,7 @@ export interface SSRManifest {
 	_: {
 		client: NonNullable<BuildData['client']>;
 		nodes: SSRNodeLoader[];
+		/** hashed filename -> import to that file */
 		remotes: Record<string, () => Promise<any>>;
 		routes: SSRRoute[];
 		prerendered_routes: Set<string>;
diff --git a/packages/kit/src/exports/vite/build/build_remotes.js b/packages/kit/src/exports/vite/build/build_remotes.js
new file mode 100644
index 000000000000..092544212f14
--- /dev/null
+++ b/packages/kit/src/exports/vite/build/build_remotes.js
@@ -0,0 +1,44 @@
+import fs from 'fs';
+import path from 'path';
+import { dedent } from '../../../core/sync/utils.js';
+
+/**
+ * Adjusts the remote entry points such that that they include the correct action URL if needed
+ * @param {import('types').ServerMetadata} metadata
+ * @param {import('types').ValidatedConfig} svelte_config
+ * @param {string} out
+ */
+export function build_remotes(metadata, svelte_config, out) {
+	for (const [name, exports] of metadata.remotes) {
+		const file_path = `${out}/server/remote/${name}.js`;
+		const sibling_file_path = file_path + '__internal.js';
+		const merged_exports = [...exports.values()].flatMap(names => names);
+
+		fs.copyFileSync(file_path, sibling_file_path);
+		fs.writeFileSync(
+			file_path,
+			create_public_remote_file(merged_exports, `./${path.basename(sibling_file_path)}`, name, svelte_config),
+			'utf-8'
+		);
+	}
+}
+
+/**
+ * @param {string[]} exports
+ * @param {string} id
+ * @param {string} hash
+ * @param {import('types').ValidatedConfig} svelte_config
+ */
+export function create_public_remote_file(exports, id, hash, svelte_config) {
+	return dedent`
+    import { ${exports.join(', ')} } from '${id}';
+    let $$_exports = {${exports.join(',')}};
+    for (const key in $$_exports) {
+        const fn = $$_exports[key];
+        if (fn.__type === 'formAction') {
+            fn._set_action('${svelte_config.kit.paths.base}/${svelte_config.kit.appDir}/remote/${hash}/' + key);
+        }
+    }
+    export { ${exports.join(', ')} };
+`;
+}
diff --git a/packages/kit/src/exports/vite/index.js b/packages/kit/src/exports/vite/index.js
index 4fef5cdde227..d5ae469a4739 100644
--- a/packages/kit/src/exports/vite/index.js
+++ b/packages/kit/src/exports/vite/index.js
@@ -36,6 +36,7 @@ import {
 } from './module_ids.js';
 import { resolve_peer_dependency } from '../../utils/import.js';
 import { compact } from '../../utils/array.js';
+import { build_remotes, create_public_remote_file } from './build/build_remotes.js';
 
 const cwd = process.cwd();
 
@@ -581,63 +582,128 @@ Tips:
 		}
 	};
 
+	/** @type {import('vite').ViteDevServer} */
+	let dev_server;
+
+	const remote_virtual_suffix = '.__virtual';
+	/** @type {Record<string, string>} */
+	const remote_cache = {};
+	/** @type {import('types').ServerMetadata['remotes'] | undefined} only set at build time */
+	let remote_exports = undefined;
+
 	/** @type {import('vite').Plugin} */
 	const plugin_remote = {
 		name: 'vite-plugin-sveltekit-remote',
 
+		configureServer(_dev_server) {
+			dev_server = _dev_server;
+		},
+
+		async resolveId(id, importer) {
+			if (id.endsWith(remote_virtual_suffix)) {
+				return id;
+			}
+
+			if (importer?.endsWith(remote_virtual_suffix)) {
+				return this.resolve(
+					id,
+					posixify(process.cwd()) + importer.slice(0, -remote_virtual_suffix.length)
+				);
+			}
+		},
+
+		async load(id) {
+			if (id.endsWith(remote_virtual_suffix)) {
+				return remote_cache[posixify(process.cwd()) + id.slice(0, -remote_virtual_suffix.length)];
+			}
+		},
+
 		/**
 		 * @param {string} code
 		 * @param {string} id
 		 * @param {any} opts
 		 */
-		transform(code, id, opts) {
-			if (opts.ssr) {
-				return;
-			}
-
+		async transform(code, id, opts) {
 			if (!svelte_config.kit.moduleExtensions.some((ext) => id.endsWith(`.remote${ext}`))) {
 				return;
 			}
 
-			/** @type {string[]} */
-			const names = [];
-			const program = this.parse(code);
+			const hashed_id = hash(posixify(id));
 
-			for (const node of program.body) {
-				if (node.type === 'ExportNamedDeclaration') {
-					for (const specifier of node.specifiers) {
-						names.push(/** @type {{ name: string }} */ (specifier.exported).name);
-					}
+			if (opts.ssr) {
+				// build does this in a separate step because dev_server is not available to it
+				if (!dev_server) return;
+
+				remote_cache[id] = code;
+				const module = await dev_server.ssrLoadModule(id + remote_virtual_suffix);
+				const exports = Object.keys(module);
+				return create_public_remote_file(
+					exports,
+					id + remote_virtual_suffix,
+					hashed_id,
+					svelte_config
+				);
+			}
 
-					if (node.declaration) {
-						if (node.declaration.type === 'FunctionDeclaration') {
-							names.push(node.declaration.id.name);
-						} else if (node.declaration.type === 'VariableDeclaration') {
-							for (const declarator of node.declaration.declarations) {
-								if (declarator.id.type !== 'Identifier') {
-									throw new Error('TODO');
-								}
+			/** @type {Map<string, string[]>} */
+			const remotes = new Map();
 
-								names.push(declarator.id.name);
-							}
-						}
+			if (remote_exports) {
+				const exports = remote_exports.get(hashed_id);
+				if (!exports) throw new Error('Expected to find metadata for remote file ' + id);
+
+				for (const [name, value] of exports) {
+					if (name === 'other') continue;
+					const type = name_to_client_export(name);
+					remotes.set(type, value);
+				}
+			} else if (dev_server) {
+				const modules = await dev_server.ssrLoadModule(id);
+				for (const [name, value] of Object.entries(modules)) {
+					if (value.__type) {
+						const type = name_to_client_export(value.__type);
+						remotes.set(type, (remotes.get(type) ?? []).concat(name));
 					}
 				}
+			} else {
+				throw new Error(
+					'plugin-remote error: Expected one of dev_server and remote_exports to be available'
+				);
+			}
+
+			/** @param {string} name */
+			function name_to_client_export(name) {
+				return 'remote' + name[0].toUpperCase() + name.slice(1);
 			}
 
-			let fn = 'remote';
+			const exports = [];
+			const specifiers = [];
+
+			for (const [type, _exports] of remotes) {
+				// TODO handle default export
+				const result = exports_and_fn(type, _exports);
+				exports.push(...result.exports);
+				specifiers.push(result.specifier);
+			}
 
-			// belt and braces — guard against an existing `export function remote() {...}`
-			let n = 1;
-			while (names.includes(fn)) fn = `remote$${n++}`;
+			/**
+			 * @param {string} remote_import
+			 * @param {string[]} names
+			 */
+			function exports_and_fn(remote_import, names) {
+				// belt and braces — guard against an existing `export function remote() {...}`
+				let n = 1;
+				let fn = remote_import;
+				while (names.includes(fn)) fn = `${fn}$${n++}`;
 
-			const h = hash(id);
-			const exports = names.map((n) => `export const ${n} = ${fn}('${h}/${n}');`);
+				const exports = names.map((n) => `export const ${n} = ${fn}('${hashed_id}/${n}');`);
+				const specifier = fn === remote_import ? fn : `${fn} as ${fn}`;
 
-			const specifier = fn === 'remote' ? fn : `remote as ${fn}`;
+				return { exports, specifier };
+			}
 
 			return {
-				code: `import { ${specifier} } from '__sveltekit/remote';\n\n${exports.join('\n')}\n`
+				code: `import { ${specifiers.join(', ')} } from '__sveltekit/remote';\n\n${exports.join('\n')}\n`
 			};
 		}
 	};
@@ -897,8 +963,12 @@ Tips:
 					env: { ...env.private, ...env.public }
 				});
 
+				remote_exports = metadata.remotes;
+
 				log.info('Building app');
 
+				build_remotes(metadata, svelte_config, out);
+
 				// create client build
 				write_client_manifest(
 					kit,
diff --git a/packages/kit/src/runtime/client/client.js b/packages/kit/src/runtime/client/client.js
index 78843bfcd900..3ffb2bcbba36 100644
--- a/packages/kit/src/runtime/client/client.js
+++ b/packages/kit/src/runtime/client/client.js
@@ -2953,7 +2953,31 @@ if (DEV) {
 /**
  * @param {string} id
  */
-export function remote(id) {
+export function remoteQuery(id) {
+	return async (/** @type {any} */ ...args) => {
+		const transport = app.hooks.transport;
+		const encoders = Object.fromEntries(
+			Object.entries(transport).map(([key, value]) => [key, value.encode])
+		);
+
+		const response = await fetch(
+			`/${app_dir}/remote/${id}?args=${encodeURIComponent(devalue.stringify(args, encoders))}`
+		);
+		const result = await response.json();
+
+		if (!response.ok) {
+			// TODO should this go through `handleError`?
+			throw new Error(result.message);
+		}
+
+		return devalue.parse(result, app.decoders);
+	};
+}
+
+/**
+ * @param {string} id
+ */
+export function remoteAction(id) {
 	return async (/** @type {any} */ ...args) => {
 		const transport = app.hooks.transport;
 		const encoders = Object.fromEntries(
@@ -2978,3 +3002,13 @@ export function remote(id) {
 		return devalue.parse(result, app.decoders);
 	};
 }
+
+/**
+ * @param {string} id
+ */
+export function remoteFormAction(id) {
+	return {
+		method: 'POST',
+		action: `/${app_dir}/remote/${id}`
+	};
+}
diff --git a/packages/kit/src/runtime/server/remote/index.js b/packages/kit/src/runtime/server/remote/index.js
index ef897240721d..bd2f27f63d93 100644
--- a/packages/kit/src/runtime/server/remote/index.js
+++ b/packages/kit/src/runtime/server/remote/index.js
@@ -2,6 +2,9 @@ import { json } from '../../../exports/index.js';
 import * as devalue from 'devalue';
 import { app_dir } from '__sveltekit/paths';
 import { error } from 'console';
+import { with_event } from '../../app/server/event.js';
+import { is_form_content_type } from '../../../utils/http.js';
+import { SvelteKitError } from '../../control.js';
 
 /**
  * @param {import('@sveltejs/kit').RequestEvent} event
@@ -22,12 +25,33 @@ export async function handle_remote_call(event, options, manifest) {
 	if (!func) error(404);
 
 	const transport = options.hooks.transport;
-	const args_json = await event.request.text();
-	const decoders = Object.fromEntries(Object.entries(transport).map(([k, v]) => [k, v.decode]));
-	const args = devalue.parse(args_json, decoders);
-	const data = await func.apply(null, args);
 
-	return json(stringify_rpc_response(data, transport));
+	if (func.__type === 'formAction') {
+		if (!is_form_content_type(event.request)) {
+			throw new SvelteKitError(
+				415,
+				'Unsupported Media Type',
+				`Form actions expect form-encoded data — received ${event.request.headers.get(
+					'content-type'
+				)}`
+			);
+		}
+
+		const form_data = await event.request.formData();
+		const data = await with_event(event, () => func.apply(null, form_data));
+		// TODO what should happen with the result? how to incorporate it into the page?
+		throw new Error('Form actions are not yet supported');
+	} else {
+		const args_json =
+			func.__type === 'query'
+				? /** @type {string} */ (event.url.searchParams.get('args'))
+				: await event.request.text();
+		const decoders = Object.fromEntries(Object.entries(transport).map(([k, v]) => [k, v.decode]));
+		const args = devalue.parse(args_json, decoders);
+		const data = await with_event(event, () => func.apply(null, args));
+
+		return json(stringify_rpc_response(data, transport));
+	}
 }
 
 /**
diff --git a/packages/kit/src/runtime/server/respond.js b/packages/kit/src/runtime/server/respond.js
index 6f40bf0cbdfc..9f11d2c2a0de 100644
--- a/packages/kit/src/runtime/server/respond.js
+++ b/packages/kit/src/runtime/server/respond.js
@@ -17,7 +17,7 @@ import { redirect_json_response, render_data } from './data/index.js';
 import { add_cookies_to_headers, get_cookies } from './cookie.js';
 import { create_fetch } from './fetch.js';
 import { PageNodes } from '../../utils/page_nodes.js';
-import { HttpError, Redirect, SvelteKitError } from '../control.js';
+import { Redirect, SvelteKitError } from '../control.js';
 import { validate_server_exports } from '../../utils/exports.js';
 import { json, text } from '../../exports/index.js';
 import { action_json_redirect, is_action_json_request } from './page/actions.js';
@@ -70,7 +70,11 @@ export async function respond(request, options, manifest, state) {
 	if (options.csrf_check_origin && request.headers.get('origin') !== url.origin) {
 		const opts = { status: 403 };
 
-		if (is_remote_request) {
+		if (
+			is_remote_request &&
+			// TODO get doesn't have an origin header - any way we can still forbid other origins?
+			request.method !== 'GET'
+		) {
 			return json(
 				{
 					message: 'Cross-site remote requests are forbidden'
@@ -190,23 +194,25 @@ export async function respond(request, options, manifest, state) {
 		});
 	}
 
-	let resolved_path;
+	let resolved_path = url.pathname;
 
-	const prerendering_reroute_state = state.prerendering?.inside_reroute;
-	try {
-		// For the duration or a reroute, disable the prerendering state as reroute could call API endpoints
-		// which would end up in the wrong logic path if not disabled.
-		if (state.prerendering) state.prerendering.inside_reroute = true;
-
-		// reroute could alter the given URL, so we pass a copy
-		resolved_path =
-			(await options.hooks.reroute({ url: new URL(url), fetch: event.fetch })) ?? url.pathname;
-	} catch {
-		return text('Internal Server Error', {
-			status: 500
-		});
-	} finally {
-		if (state.prerendering) state.prerendering.inside_reroute = prerendering_reroute_state;
+	if (!is_remote_request) {
+		const prerendering_reroute_state = state.prerendering?.inside_reroute;
+		try {
+			// For the duration or a reroute, disable the prerendering state as reroute could call API endpoints
+			// which would end up in the wrong logic path if not disabled.
+			if (state.prerendering) state.prerendering.inside_reroute = true;
+
+			// reroute could alter the given URL, so we pass a copy
+			resolved_path =
+				(await options.hooks.reroute({ url: new URL(url), fetch: event.fetch })) ?? url.pathname;
+		} catch {
+			return text('Internal Server Error', {
+				status: 500
+			});
+		} finally {
+			if (state.prerendering) state.prerendering.inside_reroute = prerendering_reroute_state;
+		}
 	}
 
 	try {
diff --git a/packages/kit/src/types/internal.d.ts b/packages/kit/src/types/internal.d.ts
index c0c430ff7d0e..9cbff26392a9 100644
--- a/packages/kit/src/types/internal.d.ts
+++ b/packages/kit/src/types/internal.d.ts
@@ -348,6 +348,8 @@ export interface ServerMetadata {
 		has_server_load: boolean;
 	}>;
 	routes: Map<string, ServerMetadataRoute>;
+	/** For each hashed remote file, its export names grouped by query/action/formAction/other */
+	remotes: Map<string, Map<string, string[]>>;
 }
 
 export interface SSRComponent {
diff --git a/packages/kit/types/index.d.ts b/packages/kit/types/index.d.ts
index 1fe7fbcb88d6..53733a6d0842 100644
--- a/packages/kit/types/index.d.ts
+++ b/packages/kit/types/index.d.ts
@@ -1306,6 +1306,8 @@ declare module '@sveltejs/kit' {
 		_: {
 			client: NonNullable<BuildData['client']>;
 			nodes: SSRNodeLoader[];
+			/** hashed filename -> import to that file */
+			remotes: Record<string, () => Promise<any>>;
 			routes: SSRRoute[];
 			prerendered_routes: Set<string>;
 			matchers: () => Promise<Record<string, ParamMatcher>>;
@@ -1766,6 +1768,7 @@ declare module '@sveltejs/kit' {
 			universal: string | null;
 		};
 		nodes: PageNode[];
+		remotes: string[];
 		routes: RouteData[];
 		matchers: Record<string, string>;
 	}
@@ -2034,6 +2037,12 @@ declare module '@sveltejs/kit' {
 		wasNormalized: boolean;
 		denormalize: (url?: string | URL) => URL;
 	};
+
+	export function formAction<T extends (formData: FormData) => any>(fn: T): T;
+
+	export function query<T extends (...args: any[]) => any>(fn: T): T;
+
+	export function action<T extends (...args: any[]) => any>(fn: T): T;
 	export type LessThan<TNumber extends number, TArray extends any[] = []> = TNumber extends TArray["length"] ? TArray[number] : LessThan<TNumber, [...TArray, TArray["length"]]>;
 	export type NumericRange<TStart extends number, TEnd extends number> = Exclude<TEnd | LessThan<TEnd>, LessThan<TStart>>;
 	export const VERSION: string;

From ad73a46de67d31df72148dbb94eeff23fd1663e8 Mon Sep 17 00:00:00 2001
From: Simon Holthausen <simon.holthausen@vercel.com>
Date: Sat, 22 Mar 2025 17:42:14 +0100
Subject: [PATCH 21/24] update playground

---
 playgrounds/basic/src/lib/foo.remote.ts   | 21 ++++++++++++++++-----
 playgrounds/basic/src/routes/+page.svelte |  7 ++++++-
 2 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/playgrounds/basic/src/lib/foo.remote.ts b/playgrounds/basic/src/lib/foo.remote.ts
index 60949e7c9562..467b44620792 100644
--- a/playgrounds/basic/src/lib/foo.remote.ts
+++ b/playgrounds/basic/src/lib/foo.remote.ts
@@ -1,11 +1,22 @@
-export const add = async (a: number, b: number) => {
-	console.log('add', a, b);
+import { x } from './relative';
+import { query, action, formAction } from '@sveltejs/kit';
+
+export const add = query(async (a: number, b: number) => {
+	console.log('add', x, a, b);
 
 	return a + b;
-};
+});
 
-export const multiply = async (a: number, b: number) => {
+export const multiply = action(async (a: number, b: number) => {
 	console.log('multiply', a, b);
 
 	return a * b;
-};
+});
+
+export const divide = formAction(async (form) => {
+	const a = form.get('a');
+	const b = form.get('b');
+	console.log('divide', a, b);
+
+	return a / b;
+});
diff --git a/playgrounds/basic/src/routes/+page.svelte b/playgrounds/basic/src/routes/+page.svelte
index b6b82601a434..76f43dcf5980 100644
--- a/playgrounds/basic/src/routes/+page.svelte
+++ b/playgrounds/basic/src/routes/+page.svelte
@@ -1,6 +1,7 @@
 <script lang="ts">
+	import { enhance } from '$app/forms';
 	import type { PageData } from './$types';
-	import { add, multiply } from '$lib/foo.remote.ts';
+	import { add, multiply, divide } from '$lib/foo.remote.ts';
 
 	let { data }: { data: PageData } = $props();
 </script>
@@ -20,3 +21,7 @@
 		console.log(result);
 	}}>multiply</button
 >
+
+<form {...divide} use:enhance>
+	<button>divide</button>
+</form>

From 8900ba32cff15e942a587056cea348c34fe0dfa3 Mon Sep 17 00:00:00 2001
From: Simon Holthausen <simon.holthausen@vercel.com>
Date: Sun, 23 Mar 2025 15:41:32 +0100
Subject: [PATCH 22/24] POC: hydrate query results

---
 packages/kit/src/exports/index.js             |  71 ------------
 .../src/exports/vite/build/build_remotes.js   |   3 +
 packages/kit/src/runtime/app/server/index.js  |   2 +
 packages/kit/src/runtime/app/server/remote.js | 104 ++++++++++++++++++
 packages/kit/src/runtime/client/client.js     |  12 +-
 .../kit/src/runtime/server/page/load_data.js  |  31 ++++--
 .../kit/src/runtime/server/page/render.js     |   4 +-
 packages/kit/src/runtime/server/respond.js    |   7 +-
 playgrounds/basic/src/lib/foo.remote.ts       |   2 +-
 playgrounds/basic/src/lib/relative.ts         |   1 +
 playgrounds/basic/src/routes/+page.svelte     |   2 +
 playgrounds/basic/src/routes/+page.ts         |   6 +-
 12 files changed, 155 insertions(+), 90 deletions(-)
 create mode 100644 packages/kit/src/runtime/app/server/remote.js
 create mode 100644 playgrounds/basic/src/lib/relative.ts

diff --git a/packages/kit/src/exports/index.js b/packages/kit/src/exports/index.js
index 4ed2b9c9fa2e..4d2bb75223f3 100644
--- a/packages/kit/src/exports/index.js
+++ b/packages/kit/src/exports/index.js
@@ -262,74 +262,3 @@ export function normalizeUrl(url) {
 		}
 	};
 }
-
-/**
- * @template {(formData: FormData) => any} T
- * @param {T} fn
- * @returns {T}
- */
-export function formAction(fn) {
-	// Better safe than sorry: Seal these properties to prevent modification
-	Object.defineProperty(fn, 'method', {
-		value: 'POST',
-		writable: false,
-		enumerable: true,
-		configurable: false
-	});
-	Object.defineProperty(fn, '__type', {
-		value: 'formAction',
-		writable: false,
-		enumerable: true,
-		configurable: false
-	});
-	let set = false;
-	Object.defineProperty(fn, '_set_action', {
-		/** @param {string} action */
-		value: (action) => {
-			if (set) return;
-			set = true;
-			Object.defineProperty(fn, 'action', {
-				value: action,
-				writable: false,
-				enumerable: true,
-				configurable: false
-			});
-		},
-		writable: false,
-		enumerable: true,
-		configurable: false
-	});
-	return fn;
-}
-
-/**
- * @template {(...args: any[]) => any} T
- * @param {T} fn
- * @returns {T}
- */
-export function query(fn) {
-	// Better safe than sorry: Seal these properties to prevent modification
-	Object.defineProperty(fn, '__type', {
-		value: 'query',
-		writable: false,
-		enumerable: true,
-		configurable: false
-	});
-	return fn;
-}
-
-/**
- * @template {(...args: any[]) => any} T
- * @param {T} fn
- * @returns {T}
- */
-export function action(fn) {
-	// Better safe than sorry: Seal these properties to prevent modification
-	Object.defineProperty(fn, '__type', {
-		value: 'action',
-		writable: false,
-		enumerable: true,
-		configurable: false
-	});
-	return fn;
-}
diff --git a/packages/kit/src/exports/vite/build/build_remotes.js b/packages/kit/src/exports/vite/build/build_remotes.js
index 092544212f14..b83a30aa8306 100644
--- a/packages/kit/src/exports/vite/build/build_remotes.js
+++ b/packages/kit/src/exports/vite/build/build_remotes.js
@@ -38,6 +38,9 @@ export function create_public_remote_file(exports, id, hash, svelte_config) {
         if (fn.__type === 'formAction') {
             fn._set_action('${svelte_config.kit.paths.base}/${svelte_config.kit.appDir}/remote/${hash}/' + key);
         }
+		if (fn.__type === 'query') {
+			fn.__id = '${hash}/' + key;
+		}
     }
     export { ${exports.join(', ')} };
 `;
diff --git a/packages/kit/src/runtime/app/server/index.js b/packages/kit/src/runtime/app/server/index.js
index 19c384932107..f33e9c4735f1 100644
--- a/packages/kit/src/runtime/app/server/index.js
+++ b/packages/kit/src/runtime/app/server/index.js
@@ -73,3 +73,5 @@ export function read(asset) {
 }
 
 export { getRequestEvent } from './event.js';
+
+export { query, action, formAction } from './remote.js';
diff --git a/packages/kit/src/runtime/app/server/remote.js b/packages/kit/src/runtime/app/server/remote.js
new file mode 100644
index 000000000000..6c0dc886426c
--- /dev/null
+++ b/packages/kit/src/runtime/app/server/remote.js
@@ -0,0 +1,104 @@
+import { stringify, uneval } from 'devalue';
+import { getRequestEvent } from './event.js';
+
+/**
+ * @template {(formData: FormData) => any} T
+ * @param {T} fn
+ * @returns {T}
+ */
+export function formAction(fn) {
+	// Better safe than sorry: Seal these properties to prevent modification
+	Object.defineProperty(fn, 'method', {
+		value: 'POST',
+		writable: false,
+		enumerable: true,
+		configurable: false
+	});
+	Object.defineProperty(fn, '__type', {
+		value: 'formAction',
+		writable: false,
+		enumerable: true,
+		configurable: false
+	});
+	let set = false;
+	Object.defineProperty(fn, '_set_action', {
+		/** @param {string} action */
+		value: (action) => {
+			if (set) return;
+			set = true;
+			Object.defineProperty(fn, 'action', {
+				value: action,
+				writable: false,
+				enumerable: true,
+				configurable: false
+			});
+		},
+		writable: false,
+		enumerable: true,
+		configurable: false
+	});
+	return fn;
+}
+
+/**
+ * @template {(...args: any[]) => any} T
+ * @param {T} fn
+ * @returns {T}
+ */
+export function query(fn) {
+	/** @param {...Parameters<T>} args */
+	const wrapper = async (...args) => {
+		// TODO don't do the additional work when we're being called from the client
+		const event = getRequestEvent();
+		const result = await fn(...args);
+		const stringified_args = stringify(args, event._.transport);
+		event._.remote_results[wrapper.__id + stringified_args] = uneval_remote_response(
+			result,
+			event._.transport
+		);
+		return result;
+	};
+	// Better safe than sorry: Seal these properties to prevent modification
+	Object.defineProperty(wrapper, '__type', {
+		value: 'query',
+		writable: false,
+		enumerable: true,
+		configurable: false
+	});
+	// @ts-expect-error
+	return wrapper;
+}
+
+/**
+ * @param {any} data
+ * @param {import('types').ServerHooks['transport']} transport
+ */
+export function uneval_remote_response(data, transport) {
+	const replacer = (/** @type {any} */ thing) => {
+		for (const key in transport) {
+			const encoded = transport[key].encode(thing);
+			if (encoded) {
+				return `app.decode('${key}', ${uneval(encoded, replacer)})`;
+			}
+		}
+	};
+
+	// TODO try_serialize
+	return uneval(data, replacer);
+}
+
+/**
+ * @template {(...args: any[]) => any} T
+ * @param {T} fn
+ * @returns {T}
+ */
+export function action(fn) {
+	// Better safe than sorry: Seal these properties to prevent modification
+	Object.defineProperty(fn, '__type', {
+		value: 'action',
+		writable: false,
+		enumerable: true,
+		configurable: false
+	});
+	return fn;
+}
diff --git a/packages/kit/src/runtime/client/client.js b/packages/kit/src/runtime/client/client.js
index 3ffb2bcbba36..965ad958ef45 100644
--- a/packages/kit/src/runtime/client/client.js
+++ b/packages/kit/src/runtime/client/client.js
@@ -173,6 +173,8 @@ let container;
 let target;
 /** @type {import('./types.js').SvelteKitApp} */
 export let app;
+/** @type {Record<string, any>} */
+let remote_responses;
 
 /** @type {Array<((url: URL) => boolean)>} */
 const invalidated = [];
@@ -276,6 +278,7 @@ export async function start(_app, _target, hydrate) {
 	}
 
 	app = _app;
+	remote_responses = hydrate.remote;
 
 	await _app.hooks.init?.();
 
@@ -2954,14 +2957,21 @@ if (DEV) {
  * @param {string} id
  */
 export function remoteQuery(id) {
+	// TODO disable "use event.fetch method instead" warning which can show up when you use remote functions in load functions
 	return async (/** @type {any} */ ...args) => {
 		const transport = app.hooks.transport;
 		const encoders = Object.fromEntries(
 			Object.entries(transport).map(([key, value]) => [key, value.encode])
 		);
 
+		const stringified_args = devalue.stringify(args, encoders);
+		if (!started) {
+			const result = remote_responses[id + stringified_args];
+			if (result) return result;
+		}
+
 		const response = await fetch(
-			`/${app_dir}/remote/${id}?args=${encodeURIComponent(devalue.stringify(args, encoders))}`
+			`/${app_dir}/remote/${id}?args=${encodeURIComponent(stringified_args)}`
 		);
 		const result = await response.json();
 
diff --git a/packages/kit/src/runtime/server/page/load_data.js b/packages/kit/src/runtime/server/page/load_data.js
index 2ada2b6ecde6..efdcde5c2971 100644
--- a/packages/kit/src/runtime/server/page/load_data.js
+++ b/packages/kit/src/runtime/server/page/load_data.js
@@ -196,21 +196,28 @@ export async function load_data({
 }) {
 	const server_data_node = await server_data_promise;
 
-	if (!node?.universal?.load) {
+	const load = node?.universal?.load;
+
+	if (!load) {
 		return server_data_node?.data ?? null;
 	}
 
-	const result = await node.universal.load.call(null, {
-		url: event.url,
-		params: event.params,
-		data: server_data_node?.data ?? null,
-		route: event.route,
-		fetch: create_universal_fetch(event, state, fetched, csr, resolve_opts),
-		setHeaders: event.setHeaders,
-		depends: () => {},
-		parent,
-		untrack: (fn) => fn()
-	});
+	// TODO it's not great that we're adding getRequestEvent context to the universal load function,
+	// but it's needed in order to be able to use remote calls that are hydrated within it.
+	// Do we need another, hidden getRequestEvent-like function for this?
+	const result = await with_event(event, () =>
+		load.call(null, {
+			url: event.url,
+			params: event.params,
+			data: server_data_node?.data ?? null,
+			route: event.route,
+			fetch: create_universal_fetch(event, state, fetched, csr, resolve_opts),
+			setHeaders: event.setHeaders,
+			depends: () => {},
+			parent,
+			untrack: (fn) => fn()
+		})
+	);
 
 	if (__SVELTEKIT_DEV__) {
 		validate_load_response(result, node.universal_id);
diff --git a/packages/kit/src/runtime/server/page/render.js b/packages/kit/src/runtime/server/page/render.js
index 59d9229164dc..ee7862e831ae 100644
--- a/packages/kit/src/runtime/server/page/render.js
+++ b/packages/kit/src/runtime/server/page/render.js
@@ -189,6 +189,7 @@ export async function render_response({
 			};
 
 			try {
+				// TODO once Svelte 5 has async we want to make this "with_event", too, so that RPC in here can hydrate stuff
 				rendered = options.root.render(props, render_opts);
 			} finally {
 				globalThis.fetch = fetch;
@@ -404,7 +405,8 @@ export async function render_response({
 				`node_ids: [${branch.map(({ node }) => node.index).join(', ')}]`,
 				`data: ${data}`,
 				`form: ${serialized.form}`,
-				`error: ${serialized.error}`
+				`error: ${serialized.error}`,
+				`remote: ${s(event._.remote_results)}`
 			];
 
 			if (status !== 200) {
diff --git a/packages/kit/src/runtime/server/respond.js b/packages/kit/src/runtime/server/respond.js
index 9f11d2c2a0de..78c002e94c94 100644
--- a/packages/kit/src/runtime/server/respond.js
+++ b/packages/kit/src/runtime/server/respond.js
@@ -175,7 +175,12 @@ export async function respond(request, options, manifest, state) {
 		},
 		url,
 		isDataRequest: is_data_request,
-		isSubRequest: state.depth > 0
+		isSubRequest: state.depth > 0,
+		// TODO tidy up
+		_: {
+			remote_results: {},
+			transport: options.hooks.transport
+		}
 	};
 
 	event.fetch = create_fetch({
diff --git a/playgrounds/basic/src/lib/foo.remote.ts b/playgrounds/basic/src/lib/foo.remote.ts
index 467b44620792..ef9f8543d32c 100644
--- a/playgrounds/basic/src/lib/foo.remote.ts
+++ b/playgrounds/basic/src/lib/foo.remote.ts
@@ -1,5 +1,5 @@
 import { x } from './relative';
-import { query, action, formAction } from '@sveltejs/kit';
+import { query, action, formAction } from '$app/server';
 
 export const add = query(async (a: number, b: number) => {
 	console.log('add', x, a, b);
diff --git a/playgrounds/basic/src/lib/relative.ts b/playgrounds/basic/src/lib/relative.ts
new file mode 100644
index 000000000000..30dc55a73230
--- /dev/null
+++ b/playgrounds/basic/src/lib/relative.ts
@@ -0,0 +1 @@
+export const x = true;
diff --git a/playgrounds/basic/src/routes/+page.svelte b/playgrounds/basic/src/routes/+page.svelte
index 76f43dcf5980..643f17c3f48d 100644
--- a/playgrounds/basic/src/routes/+page.svelte
+++ b/playgrounds/basic/src/routes/+page.svelte
@@ -8,6 +8,8 @@
 
 <h1>Welcome to SvelteKit</h1>
 
+<div>From load fn: {data.sum}</div>
+
 <button
 	onclick={async () => {
 		const result = await add(2, 3);
diff --git a/playgrounds/basic/src/routes/+page.ts b/playgrounds/basic/src/routes/+page.ts
index 758f66e89fa6..8e7c028718b5 100644
--- a/playgrounds/basic/src/routes/+page.ts
+++ b/playgrounds/basic/src/routes/+page.ts
@@ -1,6 +1,6 @@
+import { add } from '$lib/foo.remote';
 import type { PageLoad } from './$types';
 
-export const load: PageLoad = async ({ fetch }) => {
-	const response = await fetch('/', { method: 'POST', body: JSON.stringify({ a: 2, b: 2 }) });
-	return { sum: await response.json() };
+export const load: PageLoad = async () => {
+	return { sum: await add(1, 2) };
 };

From 0f26cbc601d14f66b7cb4fc43edee52637321a15 Mon Sep 17 00:00:00 2001
From: Simon Holthausen <simon.holthausen@vercel.com>
Date: Fri, 28 Mar 2025 16:11:15 +0100
Subject: [PATCH 23/24] remote form actions that hydrate and work without JS

---
 .../src/exports/vite/build/build_remotes.js   |   5 +-
 packages/kit/src/runtime/app/server/remote.js |  48 +++--
 packages/kit/src/runtime/client/client.js     |  77 +------
 .../kit/src/runtime/client/remote.svelte.js   | 200 ++++++++++++++++++
 packages/kit/src/runtime/server/page/index.js |  32 ++-
 .../kit/src/runtime/server/page/render.js     |   4 +-
 .../kit/src/runtime/server/remote/index.js    |  16 +-
 playgrounds/basic/src/lib/foo.remote.ts       |   8 +
 playgrounds/basic/src/routes/+page.svelte     |   9 +-
 9 files changed, 289 insertions(+), 110 deletions(-)
 create mode 100644 packages/kit/src/runtime/client/remote.svelte.js

diff --git a/packages/kit/src/exports/vite/build/build_remotes.js b/packages/kit/src/exports/vite/build/build_remotes.js
index b83a30aa8306..3417afdb4b87 100644
--- a/packages/kit/src/exports/vite/build/build_remotes.js
+++ b/packages/kit/src/exports/vite/build/build_remotes.js
@@ -27,16 +27,15 @@ export function build_remotes(metadata, svelte_config, out) {
  * @param {string[]} exports
  * @param {string} id
  * @param {string} hash
- * @param {import('types').ValidatedConfig} svelte_config
  */
-export function create_public_remote_file(exports, id, hash, svelte_config) {
+export function create_public_remote_file(exports, id, hash) {
 	return dedent`
     import { ${exports.join(', ')} } from '${id}';
     let $$_exports = {${exports.join(',')}};
     for (const key in $$_exports) {
         const fn = $$_exports[key];
         if (fn.__type === 'formAction') {
-            fn._set_action('${svelte_config.kit.paths.base}/${svelte_config.kit.appDir}/remote/${hash}/' + key);
+            fn._set_action('${hash}/' + key);
         }
 		if (fn.__type === 'query') {
 			fn.__id = '${hash}/' + key;
diff --git a/packages/kit/src/runtime/app/server/remote.js b/packages/kit/src/runtime/app/server/remote.js
index 6c0dc886426c..27d7132e1217 100644
--- a/packages/kit/src/runtime/app/server/remote.js
+++ b/packages/kit/src/runtime/app/server/remote.js
@@ -7,37 +7,61 @@ import { getRequestEvent } from './event.js';
  * @returns {T}
  */
 export function formAction(fn) {
+	/** @param {FormData} form_data */
+	const wrapper = async (form_data) => {
+		// TODO don't do the additional work when we're being called from the client?
+		const event = getRequestEvent();
+		const result = await fn(form_data);
+		event._.remote_results[wrapper.form.action] = uneval_remote_response(result, event._.transport);
+		return result;
+	};
 	// Better safe than sorry: Seal these properties to prevent modification
-	Object.defineProperty(fn, 'method', {
-		value: 'POST',
+	Object.defineProperty(wrapper, 'form', {
+		value: { method: 'POST', action: '' },
 		writable: false,
 		enumerable: true,
 		configurable: false
 	});
-	Object.defineProperty(fn, '__type', {
+	Object.defineProperty(wrapper, 'formAction', {
+		value: { formaction: '' },
+		writable: false,
+		enumerable: true,
+		configurable: false
+	});
+	Object.defineProperty(wrapper, '__type', {
 		value: 'formAction',
 		writable: false,
 		enumerable: true,
 		configurable: false
 	});
 	let set = false;
-	Object.defineProperty(fn, '_set_action', {
+	Object.defineProperty(wrapper, '_set_action', {
 		/** @param {string} action */
 		value: (action) => {
 			if (set) return;
 			set = true;
-			Object.defineProperty(fn, 'action', {
-				value: action,
-				writable: false,
-				enumerable: true,
-				configurable: false
-			});
+			wrapper.form.action = `?/remote=${encodeURIComponent(action)}`;
+			wrapper.formAction.formaction = `?/remote=${encodeURIComponent(action)}`;
 		},
 		writable: false,
 		enumerable: true,
 		configurable: false
 	});
-	return fn;
+	Object.defineProperty(wrapper, 'result', {
+		get() {
+			try {
+				const event = getRequestEvent();
+				return event._.remote_results[wrapper.form.action] ?? null;
+			} catch (e) {
+				return null;
+			}
+		},
+		enumerable: true,
+		configurable: false
+	});
+
+	// @ts-expect-error
+	return wrapper;
 }
 
 /**
@@ -48,7 +72,7 @@ export function formAction(fn) {
 export function query(fn) {
 	/** @param {...Parameters<T>} args */
 	const wrapper = async (...args) => {
-		// TODO don't do the additional work when we're being called from the client
+		// TODO don't do the additional work when we're being called from the client?
 		const event = getRequestEvent();
 		const result = await fn(...args);
 		const stringified_args = stringify(args, event._.transport);
diff --git a/packages/kit/src/runtime/client/client.js b/packages/kit/src/runtime/client/client.js
index 965ad958ef45..bb1fbc4b939c 100644
--- a/packages/kit/src/runtime/client/client.js
+++ b/packages/kit/src/runtime/client/client.js
@@ -22,7 +22,7 @@ import {
 	create_updated_store,
 	load_css
 } from './utils.js';
-import { app_dir, base } from '__sveltekit/paths';
+import { base } from '__sveltekit/paths';
 import * as devalue from 'devalue';
 import {
 	HISTORY_INDEX,
@@ -43,6 +43,7 @@ import { page, update, navigating } from './state.svelte.js';
 import { add_data_suffix, add_resolution_suffix } from '../pathname.js';
 
 export { load_css };
+export { remoteAction, remoteFormAction, remoteQuery } from './remote.svelte.js';
 
 const ICON_REL_ATTRIBUTES = new Set(['icon', 'shortcut icon', 'apple-touch-icon']);
 
@@ -174,7 +175,7 @@ let target;
 /** @type {import('./types.js').SvelteKitApp} */
 export let app;
 /** @type {Record<string, any>} */
-let remote_responses;
+export let remote_responses;
 
 /** @type {Array<((url: URL) => boolean)>} */
 const invalidated = [];
@@ -224,7 +225,7 @@ let current = {
 
 /** this being true means we SSR'd */
 let hydrated = false;
-let started = false;
+export let started = false;
 let autoscroll = true;
 let updating = false;
 let is_navigating = false;
@@ -2952,73 +2953,3 @@ if (DEV) {
 		});
 	}
 }
-
-/**
- * @param {string} id
- */
-export function remoteQuery(id) {
-	// TODO disable "use event.fetch method instead" warning which can show up when you use remote functions in load functions
-	return async (/** @type {any} */ ...args) => {
-		const transport = app.hooks.transport;
-		const encoders = Object.fromEntries(
-			Object.entries(transport).map(([key, value]) => [key, value.encode])
-		);
-
-		const stringified_args = devalue.stringify(args, encoders);
-		if (!started) {
-			const result = remote_responses[id + stringified_args];
-			if (result) return result;
-		}
-
-		const response = await fetch(
-			`/${app_dir}/remote/${id}?args=${encodeURIComponent(stringified_args)}`
-		);
-		const result = await response.json();
-
-		if (!response.ok) {
-			// TODO should this go through `handleError`?
-			throw new Error(result.message);
-		}
-
-		return devalue.parse(result, app.decoders);
-	};
-}
-
-/**
- * @param {string} id
- */
-export function remoteAction(id) {
-	return async (/** @type {any} */ ...args) => {
-		const transport = app.hooks.transport;
-		const encoders = Object.fromEntries(
-			Object.entries(transport).map(([key, value]) => [key, value.encode])
-		);
-
-		const response = await fetch(`/${app_dir}/remote/${id}`, {
-			method: 'POST',
-			body: devalue.stringify(args, encoders), // TODO maybe don't use devalue.stringify here
-			headers: {
-				'Content-Type': 'application/json'
-			}
-		});
-
-		const result = await response.json();
-
-		if (!response.ok) {
-			// TODO should this go through `handleError`?
-			throw new Error(result.message);
-		}
-
-		return devalue.parse(result, app.decoders);
-	};
-}
-
-/**
- * @param {string} id
- */
-export function remoteFormAction(id) {
-	return {
-		method: 'POST',
-		action: `/${app_dir}/remote/${id}`
-	};
-}
diff --git a/packages/kit/src/runtime/client/remote.svelte.js b/packages/kit/src/runtime/client/remote.svelte.js
new file mode 100644
index 000000000000..be8ead2dd718
--- /dev/null
+++ b/packages/kit/src/runtime/client/remote.svelte.js
@@ -0,0 +1,200 @@
+import { app_dir } from '__sveltekit/paths';
+import * as devalue from 'devalue';
+import { DEV } from 'esm-env';
+import { app, remote_responses, started } from './client.js';
+
+/**
+ * @param {string} id
+ */
+export function remoteQuery(id) {
+	// TODO disable "use event.fetch method instead" warning which can show up when you use remote functions in load functions
+	return async (/** @type {any} */ ...args) => {
+		const transport = app.hooks.transport;
+		const encoders = Object.fromEntries(
+			Object.entries(transport).map(([key, value]) => [key, value.encode])
+		);
+
+		const stringified_args = devalue.stringify(args, encoders);
+		if (!started) {
+			const result = remote_responses[id + stringified_args];
+			if (result) return result;
+		}
+
+		const response = await fetch(
+			`/${app_dir}/remote/${id}?args=${encodeURIComponent(stringified_args)}`
+		);
+		const result = await response.json();
+
+		if (!response.ok) {
+			// TODO should this go through `handleError`?
+			throw new Error(result.message);
+		}
+
+		return devalue.parse(result, app.decoders);
+	};
+}
+
+/**
+ * @param {string} id
+ */
+export function remoteAction(id) {
+	return async (/** @type {any} */ ...args) => {
+		const transport = app.hooks.transport;
+		const encoders = Object.fromEntries(
+			Object.entries(transport).map(([key, value]) => [key, value.encode])
+		);
+
+		const response = await fetch(`/${app_dir}/remote/${id}`, {
+			method: 'POST',
+			body: devalue.stringify(args, encoders), // TODO maybe don't use devalue.stringify here
+			headers: {
+				'Content-Type': 'application/json'
+			}
+		});
+
+		const result = await response.json();
+
+		if (!response.ok) {
+			// TODO should this go through `handleError`?
+			throw new Error(result.message);
+		}
+
+		return devalue.parse(result, app.decoders);
+	};
+}
+
+/**
+ * @param {string} id
+ */
+export function remoteFormAction(id) {
+	/**
+	 * Shallow clone an element, so that we can access e.g. `form.action` without worrying
+	 * that someone has added an `<input name="action">` (https://github.com/sveltejs/kit/issues/7593)
+	 * @template {HTMLElement} T
+	 * @param {T} element
+	 * @returns {T}
+	 */
+	function clone(element) {
+		return /** @type {T} */ (HTMLElement.prototype.cloneNode.call(element));
+	}
+
+	const action = '?/remote=' + encodeURIComponent(id);
+
+	/** @type {any} */
+	let result = $state(!started ? (remote_responses[action] ?? null) : null);
+
+	return {
+		get result() {
+			return result;
+		},
+		form: {
+			method: 'POST',
+			action,
+			/** @param {SubmitEvent} event */
+			onsubmit: async (event) => {
+				const form_element = /** @type {HTMLFormElement} */ (event.target);
+				const method = event.submitter?.hasAttribute('formmethod')
+					? /** @type {HTMLButtonElement | HTMLInputElement} */ (event.submitter).formMethod
+					: clone(form_element).method;
+
+				if (method !== 'post') return;
+
+				const action = new URL(
+					// We can't do submitter.formAction directly because that property is always set
+					event.submitter?.hasAttribute('formaction')
+						? /** @type {HTMLButtonElement | HTMLInputElement} */ (event.submitter).formAction
+						: clone(form_element).action
+				);
+
+				if (action.searchParams.get('/remote') !== id) {
+					return;
+				}
+
+				event.preventDefault();
+
+				const form_data = new FormData(form_element);
+
+				if (DEV) {
+					const enctype = event.submitter?.hasAttribute('formenctype')
+						? /** @type {HTMLButtonElement | HTMLInputElement} */ (event.submitter).formEnctype
+						: clone(form_element).enctype;
+					if (enctype !== 'multipart/form-data') {
+						for (const value of form_data.values()) {
+							if (value instanceof File) {
+								throw new Error(
+									'Your form contains <input type="file"> fields, but is missing the necessary `enctype="multipart/form-data"` attribute. This will lead to inconsistent behavior between enhanced and native forms. For more details, see https://github.com/sveltejs/kit/issues/9819.'
+								);
+							}
+						}
+					}
+				}
+
+				const submitter_name = event.submitter?.getAttribute('name');
+				if (submitter_name) {
+					form_data.append(submitter_name, event.submitter?.getAttribute('value') ?? '');
+				}
+
+				const response = await fetch(`/${app_dir}/remote/${id}`, {
+					method: 'POST',
+					body: form_data
+				});
+				const json = await response.json();
+
+				if (!response.ok) {
+					// TODO should this go through `handleError`?
+					throw new Error(json.message);
+				}
+
+				return (result = devalue.parse(json, app.decoders));
+			}
+		},
+		formAction: {
+			formaction: action,
+			/** @param {Event} event */
+			onclick: async (event) => {
+				const target = /** @type {HTMLButtonElement} */ (event.target);
+				const form_element = target.form;
+				if (!form_element) return;
+
+				// Prevent this from firing the form's submit event
+				event.stopPropagation();
+				event.preventDefault();
+
+				const form_data = new FormData(form_element);
+
+				if (DEV) {
+					const enctype = target.hasAttribute('formenctype')
+						? target.formEnctype
+						: clone(form_element).enctype;
+					if (enctype !== 'multipart/form-data') {
+						for (const value of form_data.values()) {
+							if (value instanceof File) {
+								throw new Error(
+									'Your form contains <input type="file"> fields, but is missing the necessary `enctype="multipart/form-data"` attribute. This will lead to inconsistent behavior between enhanced and native forms. For more details, see https://github.com/sveltejs/kit/issues/9819.'
+								);
+							}
+						}
+					}
+				}
+
+				const submitter_name = target.getAttribute('name');
+				if (submitter_name) {
+					form_data.append(submitter_name, target.getAttribute('value') ?? '');
+				}
+
+				const response = await fetch(`/${app_dir}/remote/${id}`, {
+					method: 'POST',
+					body: form_data
+				});
+				const json = await response.json();
+
+				if (!response.ok) {
+					// TODO should this go through `handleError`?
+					throw new Error(json.message);
+				}
+
+				return (result = devalue.parse(json, app.decoders));
+			}
+		}
+	};
+}
diff --git a/packages/kit/src/runtime/server/page/index.js b/packages/kit/src/runtime/server/page/index.js
index 01337e4cac1c..3e7bd5af421a 100644
--- a/packages/kit/src/runtime/server/page/index.js
+++ b/packages/kit/src/runtime/server/page/index.js
@@ -15,6 +15,7 @@ import { render_response } from './render.js';
 import { respond_with_error } from './respond_with_error.js';
 import { get_data_json } from '../data/index.js';
 import { DEV } from 'esm-env';
+import { handle_remote_call } from '../remote/index.js';
 
 /**
  * The maximum request depth permitted before assuming we're stuck in an infinite loop
@@ -53,17 +54,26 @@ export async function render_page(event, page, options, manifest, state, nodes,
 		let action_result = undefined;
 
 		if (is_action_request(event)) {
-			// for action requests, first call handler in +page.server.js
-			// (this also determines status code)
-			action_result = await handle_action_request(event, leaf_node.server);
-			if (action_result?.type === 'redirect') {
-				return redirect_response(action_result.status, action_result.location);
-			}
-			if (action_result?.type === 'error') {
-				status = get_status(action_result.error);
-			}
-			if (action_result?.type === 'failure') {
-				status = action_result.status;
+			if (event.url.searchParams.has('/remote')) {
+				await handle_remote_call(
+					event,
+					options,
+					manifest,
+					/** @type {string} */ (event.url.searchParams.get('/remote'))
+				);
+			} else {
+				// for action requests, first call handler in +page.server.js
+				// (this also determines status code)
+				action_result = await handle_action_request(event, leaf_node.server);
+				if (action_result?.type === 'redirect') {
+					return redirect_response(action_result.status, action_result.location);
+				}
+				if (action_result?.type === 'error') {
+					status = get_status(action_result.error);
+				}
+				if (action_result?.type === 'failure') {
+					status = action_result.status;
+				}
 			}
 		}
 
diff --git a/packages/kit/src/runtime/server/page/render.js b/packages/kit/src/runtime/server/page/render.js
index ee7862e831ae..0a49e432116b 100644
--- a/packages/kit/src/runtime/server/page/render.js
+++ b/packages/kit/src/runtime/server/page/render.js
@@ -15,6 +15,7 @@ import { SVELTE_KIT_ASSETS } from '../../../constants.js';
 import { SCHEME } from '../../../utils/url.js';
 import { create_server_routing_response, generate_route_object } from './server_routing.js';
 import { add_resolution_suffix } from '../../pathname.js';
+import { with_event } from '../../app/server/event.js';
 
 // TODO rename this function/module
 
@@ -189,8 +190,7 @@ export async function render_response({
 			};
 
 			try {
-				// TODO once Svelte 5 has async we want to make this "with_event", too, so that RPC in here can hydrate stuff
-				rendered = options.root.render(props, render_opts);
+				rendered = with_event(event, () => options.root.render(props, render_opts));
 			} finally {
 				globalThis.fetch = fetch;
 				paths.reset();
diff --git a/packages/kit/src/runtime/server/remote/index.js b/packages/kit/src/runtime/server/remote/index.js
index bd2f27f63d93..e8067dce2b5d 100644
--- a/packages/kit/src/runtime/server/remote/index.js
+++ b/packages/kit/src/runtime/server/remote/index.js
@@ -10,10 +10,15 @@ import { SvelteKitError } from '../../control.js';
  * @param {import('@sveltejs/kit').RequestEvent} event
  * @param {import('types').SSROptions} options
  * @param {import('@sveltejs/kit').SSRManifest} manifest
+ * @param {string} [id]
  */
-export async function handle_remote_call(event, options, manifest) {
-	const id = event.url.pathname.replace(`/${app_dir}/remote/`, '');
-
+export async function handle_remote_call(
+	event,
+	options,
+	manifest,
+	id = event.url.pathname.replace(`/${app_dir}/remote/`, '')
+) {
+	console.log('id', id);
 	const [hash, func_name] = id.split('/');
 	const remotes = manifest._.remotes;
 
@@ -38,9 +43,8 @@ export async function handle_remote_call(event, options, manifest) {
 		}
 
 		const form_data = await event.request.formData();
-		const data = await with_event(event, () => func.apply(null, form_data));
-		// TODO what should happen with the result? how to incorporate it into the page?
-		throw new Error('Form actions are not yet supported');
+		const data = await with_event(event, () => func(form_data)); // TODO func.apply(null, form_data) doesn't work for unknown reasons
+		return json(stringify_rpc_response(data, transport));
 	} else {
 		const args_json =
 			func.__type === 'query'
diff --git a/playgrounds/basic/src/lib/foo.remote.ts b/playgrounds/basic/src/lib/foo.remote.ts
index ef9f8543d32c..5ae2a09a0363 100644
--- a/playgrounds/basic/src/lib/foo.remote.ts
+++ b/playgrounds/basic/src/lib/foo.remote.ts
@@ -20,3 +20,11 @@ export const divide = formAction(async (form) => {
 
 	return a / b;
 });
+
+export const multiply2 = formAction(async (form) => {
+	const a = form.get('a');
+	const b = form.get('b');
+	console.log('multiply', a, b);
+
+	return a * b;
+});
diff --git a/playgrounds/basic/src/routes/+page.svelte b/playgrounds/basic/src/routes/+page.svelte
index 643f17c3f48d..7e7bfb9dfd90 100644
--- a/playgrounds/basic/src/routes/+page.svelte
+++ b/playgrounds/basic/src/routes/+page.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { enhance } from '$app/forms';
 	import type { PageData } from './$types';
-	import { add, multiply, divide } from '$lib/foo.remote.ts';
+	import { add, multiply, multiply2, divide } from '$lib/foo.remote.ts';
 
 	let { data }: { data: PageData } = $props();
 </script>
@@ -24,6 +24,9 @@
 	}}>multiply</button
 >
 
-<form {...divide} use:enhance>
-	<button>divide</button>
+<form {...divide.form}>
+	<input name="a" value="2" />
+	<input name="b" value="1" />
+	<button>divide ({divide.result})</button>
+	<button {...multiply2.formAction}>multiply2 ({multiply2.result})</button>
 </form>

From 09f81ab5440c8b669c3d8708c7f7089a43ce8ff1 Mon Sep 17 00:00:00 2001
From: Simon Holthausen <simon.holthausen@vercel.com>
Date: Tue, 1 Apr 2025 09:30:49 +0200
Subject: [PATCH 24/24] conditional

---
 packages/kit/src/runtime/client/client.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/kit/src/runtime/client/client.js b/packages/kit/src/runtime/client/client.js
index bb1fbc4b939c..15945ca04e9a 100644
--- a/packages/kit/src/runtime/client/client.js
+++ b/packages/kit/src/runtime/client/client.js
@@ -279,7 +279,7 @@ export async function start(_app, _target, hydrate) {
 	}
 
 	app = _app;
-	remote_responses = hydrate.remote;
+	remote_responses = hydrate?.remote;
 
 	await _app.hooks.init?.();