sveltekit-remote-functions

Name: sveltekit-remote-functions
Author: spences10

364installs2forks

How to install sveltekit-remote-functions?

spences10/svelte-skills-kit/sveltekit-remote-functions

$npx -y skills add spences10/svelte-skills-kit --skill sveltekit-remote-functions

Installs into the current project.

Summary

SvelteKit remote functions guidance. Use for query(), form(), command(), and prerender() patterns in .remote.ts files.

Files · 1

View on GitHub

SKILL.md

1	# SvelteKit Remote Functions
2
3	## Current Status
4
5	Remote functions are experimental in SvelteKit 2.58. Enable them in
6	`svelte.config.js`:
7
8	```js
9	export default {
10	kit: { experimental: { remoteFunctions: true } },
11	compilerOptions: { experimental: { async: true } } // only for await in components
12	};
13	```
14
15	## Quick Start
16
17	File naming: export remote functions from `.remote.ts` or `.remote.js`.
18	Remote files can live anywhere under `src` except `src/lib/server`.
19
20	Which function?
21
22	- Dynamic reads → `query()`
23	- Progressive forms → `form()`
24	- Event-handler mutations → `command()`
25	- Build-time/static reads → `prerender()`
26
27	## Example
28
29	```ts
30	// posts.remote.ts
31	import { command, query, requested } from '$app/server';
32	import * as v from 'valibot';
33
34	export const getPosts = query(v.object({ tag: v.optional(v.string()) }), async (filter) => {
35	return db.posts.find(filter);
36	});
37
38	export const createPost = command(v.object({ title: v.string() }), async (data) => {
39	await db.posts.create(data);
40
41	for (const { query } of requested(getPosts, 5)) {
42	void query.refresh();
43	}
44	});
45	```
46
47	Client:
48
49	```svelte
50	<script lang="ts">
51	import { createPost, getPosts } from './posts.remote';
52
53	const posts = $derived(await getPosts({ tag: 'svelte' }));
54	</script>
55
56	<button onclick={() => createPost({ title: 'New' }).updates(getPosts)}>
57	Create
58	</button>
59	```
60
61	## Current Rules
62
63	- Remote functions always run on the server, even when called from the browser.
64	- Args/returns use `devalue`; avoid functions, class instances, symbols, circular refs, and `RegExp`.
65	- Validate exposed inputs with Standard Schema (`valibot`, `zod`, `arktype`, etc.) or use `.unchecked`/`'unchecked'` deliberately.
66	- `query.batch()` batches calls from the same macrotask to solve n+1 reads.
67	- `form().enhance()` `submit()` returns `true` when submission is valid/successful and `false` for validation failures.
68	- `.updates()` is client-requested; server handlers must opt in with `requested(queryFn, limit)`.
69	- `requested()` now yields `{ arg, query }`; call `query.refresh()`/`query.set(...)` on the bound instance.
70	- `limit` is required for `requested()` to cap client-controlled refresh requests.
71	- Inside command/form handlers, use `void query.refresh()`/`void query.set(value)`; SvelteKit awaits and serializes the updates.
72	- Prefer `form()` over `command()` where progressive enhancement matters.
73	- Use `prerender()` for data that changes at most once per deployment.
74	- Last verified: SvelteKit 2.58.0, 2026-04-24
75
76	## Reference Files
77
78	- [references/remote-functions.md](references/remote-functions.md) - Current patterns, examples, and gotchas
79
80	<!--
81	PROGRESSIVE DISCLOSURE GUIDELINES:
82	- Keep this file ~50 lines total (max ~150 lines)
83	- Use 1-2 code blocks only (recommend 1)
84	- Keep description <200 chars for Level 1 efficiency
85	- Move detailed docs to references/ for Level 3 loading
86	- This is Level 2 - quick reference ONLY, not a manual
87
88	LLM WORKFLOW (when editing this file):
89	1. Write/edit SKILL.md
90	2. Format (if formatter available)
91	3. Run: npx skills add . --list
92	4. If the skill is not discovered, check SKILL.md frontmatter formatting
93	5. Validate again to confirm
94	-->

People who liked this also viewed

6 picks

Type

hyperframes-cliUse the HyperFrames CLI development loop: init, add, catalog, capture, lint, check, snapshot, compare, grade-compare, preview, play, present, beats, keyframes, single or batch render, publish, cloud, SkillsJul 2026262k37k
request-refactor-planSkills for Real Engineers. Straight from my .agents directory.SkillsJul 2026165k181k
analyze-projectRigor Analyze / Rigor Audit read-only skill for deep learning research repositories. Use when the user wants to read and understand a repository, inspect model structure and training or inference entrSkillsMay 2026161k507
explore-codeRigor Improve implementation leaf skill for auditable candidate implementation in deep learning research repositories. Use when the researcher explicitly authorizes exploratory work on an isolated braSkillsMay 2026161k507
ubiquitous-languageSkills for Real Engineers. Straight from my .agents directory.SkillsJul 2026160k181k
scaffold-exercisesSkills for Real Engineers. Straight from my .agents directory.SkillsJul 2026149k181k

sveltekit-remote-functions

364installs2forks

View on GitHub

How to install sveltekit-remote-functions?

spences10/svelte-skills-kit/sveltekit-remote-functions

$npx -y skills add spences10/svelte-skills-kit --skill sveltekit-remote-functions

Installs into the current project.

Summary

SvelteKit remote functions guidance. Use for query(), form(), command(), and prerender() patterns in .remote.ts files.

Files · 1

View on GitHub

SKILL.md

1	# SvelteKit Remote Functions
2
3	## Current Status
4
5	Remote functions are experimental in SvelteKit 2.58. Enable them in
6	`svelte.config.js`:
7
8	```js
9	export default {
10	kit: { experimental: { remoteFunctions: true } },
11	compilerOptions: { experimental: { async: true } } // only for await in components
12	};
13	```
14
15	## Quick Start
16
17	File naming: export remote functions from `.remote.ts` or `.remote.js`.
18	Remote files can live anywhere under `src` except `src/lib/server`.
19
20	Which function?
21
22	- Dynamic reads → `query()`
23	- Progressive forms → `form()`
24	- Event-handler mutations → `command()`
25	- Build-time/static reads → `prerender()`
26
27	## Example
28
29	```ts
30	// posts.remote.ts
31	import { command, query, requested } from '$app/server';
32	import * as v from 'valibot';
33
34	export const getPosts = query(v.object({ tag: v.optional(v.string()) }), async (filter) => {
35	return db.posts.find(filter);
36	});
37
38	export const createPost = command(v.object({ title: v.string() }), async (data) => {
39	await db.posts.create(data);
40
41	for (const { query } of requested(getPosts, 5)) {
42	void query.refresh();
43	}
44	});
45	```
46
47	Client:
48
49	```svelte
50	<script lang="ts">
51	import { createPost, getPosts } from './posts.remote';
52
53	const posts = $derived(await getPosts({ tag: 'svelte' }));
54	</script>
55
56	<button onclick={() => createPost({ title: 'New' }).updates(getPosts)}>
57	Create
58	</button>
59	```
60
61	## Current Rules
62
63	- Remote functions always run on the server, even when called from the browser.
64	- Args/returns use `devalue`; avoid functions, class instances, symbols, circular refs, and `RegExp`.
65	- Validate exposed inputs with Standard Schema (`valibot`, `zod`, `arktype`, etc.) or use `.unchecked`/`'unchecked'` deliberately.
66	- `query.batch()` batches calls from the same macrotask to solve n+1 reads.
67	- `form().enhance()` `submit()` returns `true` when submission is valid/successful and `false` for validation failures.
68	- `.updates()` is client-requested; server handlers must opt in with `requested(queryFn, limit)`.
69	- `requested()` now yields `{ arg, query }`; call `query.refresh()`/`query.set(...)` on the bound instance.
70	- `limit` is required for `requested()` to cap client-controlled refresh requests.
71	- Inside command/form handlers, use `void query.refresh()`/`void query.set(value)`; SvelteKit awaits and serializes the updates.
72	- Prefer `form()` over `command()` where progressive enhancement matters.
73	- Use `prerender()` for data that changes at most once per deployment.
74	- Last verified: SvelteKit 2.58.0, 2026-04-24
75
76	## Reference Files
77
78	- [references/remote-functions.md](references/remote-functions.md) - Current patterns, examples, and gotchas
79
80	<!--
81	PROGRESSIVE DISCLOSURE GUIDELINES:
82	- Keep this file ~50 lines total (max ~150 lines)
83	- Use 1-2 code blocks only (recommend 1)
84	- Keep description <200 chars for Level 1 efficiency
85	- Move detailed docs to references/ for Level 3 loading
86	- This is Level 2 - quick reference ONLY, not a manual
87
88	LLM WORKFLOW (when editing this file):
89	1. Write/edit SKILL.md
90	2. Format (if formatter available)
91	3. Run: npx skills add . --list
92	4. If the skill is not discovered, check SKILL.md frontmatter formatting
93	5. Validate again to confirm
94	-->

People who liked this also viewed

6 picks

Type