From d234df84ebb6abb6b05844cbe7deacf6dda4ae59 Mon Sep 17 00:00:00 2001 From: "svelte-docs-bot[bot]" <196124396+svelte-docs-bot[bot]@users.noreply.github.com> Date: Wed, 10 Sep 2025 11:17:31 +0000 Subject: [PATCH] sync kit docs --- .../20-core-concepts/60-remote-functions.md | 53 +++++++++++++++++++ .../docs/kit/98-reference/20-$app-server.md | 45 ++++++++++++++++ 2 files changed, 98 insertions(+) diff --git a/apps/svelte.dev/content/docs/kit/20-core-concepts/60-remote-functions.md b/apps/svelte.dev/content/docs/kit/20-core-concepts/60-remote-functions.md index 91b29cbd54..2d6364e690 100644 --- a/apps/svelte.dev/content/docs/kit/20-core-concepts/60-remote-functions.md +++ b/apps/svelte.dev/content/docs/kit/20-core-concepts/60-remote-functions.md @@ -173,6 +173,59 @@ Any query can be re-fetched via its `refresh` method, which retrieves the latest > [!NOTE] Queries are cached while they're on the page, meaning `getPosts() === getPosts()`. This means you don't need a reference like `const posts = getPosts()` in order to update the query. +## query.batch + +`query.batch` works like `query` except that it batches requests that happen within the same macrotask. This solves the so-called n+1 problem: rather than each query resulting in a separate database call (for example), simultaneous queries are grouped together. + +On the server, the callback receives an array of the arguments the function was called with. It must return a function of the form `(input: Input, index: number) => Output`. SvelteKit will then call this with each of the input arguments to resolve the individual calls with their results. + +```js +/// file: weather.remote.js +// @filename: ambient.d.ts +declare module '$lib/server/database' { + export function sql(strings: TemplateStringsArray, ...values: any[]): Promise; +} +// @filename: index.js +// ---cut--- +import * as v from 'valibot'; +import { query } from '$app/server'; +import * as db from '$lib/server/database'; + +export const getWeather = query.batch(v.string(), async (cities) => { + const weather = await db.sql` + SELECT * FROM weather + WHERE city = ANY(${cities}) + `; + const lookup = new Map(weather.map(w => [w.city, w])); + + return (city) => lookup.get(city); +}); +``` + +```svelte + + + +

Weather

+ +{#each cities.slice(0, limit) as city} +

{city.name}

+ +{/each} + +{#if cities.length > limit} + +{/if} +``` + ## form The `form` function makes it easy to write data to the server. It takes a callback that receives the current [`FormData`](https://developer.mozilla.org/en-US/docs/Web/API/FormData)... diff --git a/apps/svelte.dev/content/docs/kit/98-reference/20-$app-server.md b/apps/svelte.dev/content/docs/kit/98-reference/20-$app-server.md index be0376ac33..4d26a75b77 100644 --- a/apps/svelte.dev/content/docs/kit/98-reference/20-$app-server.md +++ b/apps/svelte.dev/content/docs/kit/98-reference/20-$app-server.md @@ -263,4 +263,49 @@ function read(asset: string): Response; +## query + +
+ +```dts +namespace query { + /** + * Creates a batch query function that collects multiple calls and executes them in a single request + * + * See [Remote functions](https://svelte.dev/docs/kit/remote-functions#query.batch) for full documentation. + * + * @since 2.35 + */ + function batch( + validate: 'unchecked', + fn: ( + args: Input[] + ) => MaybePromise<(arg: Input, idx: number) => Output> + ): RemoteQueryFunction; + /** + * Creates a batch query function that collects multiple calls and executes them in a single request + * + * See [Remote functions](https://svelte.dev/docs/kit/remote-functions#query.batch) for full documentation. + * + * @since 2.35 + */ + function batch( + schema: Schema, + fn: ( + args: StandardSchemaV1.InferOutput[] + ) => MaybePromise< + ( + arg: StandardSchemaV1.InferOutput, + idx: number + ) => Output + > + ): RemoteQueryFunction< + StandardSchemaV1.InferInput, + Output + >; +} +``` + +
+