Performance & Batching
Goal: Optimize for high-frequency updates using batching and throttling.
Client-side batching
Group multiple RPC calls into a single WebSocket frame:
<script>
import { batch } from 'svelte-realtime/client';
import { createBoard, addColumn, addCard } from '$live/boards';
const [board, column, card] = await batch(() => [
createBoard('My Board'),
addColumn('To Do'),
addCard('First task')
]);
</script> Three calls, one frame, one round trip.
Server-side batching
Publish multiple events atomically:
export const resetBoard = live(async (ctx, boardId) => {
ctx.batch([
{ topic: `board:${boardId}`, event: 'set', data: [] },
{ topic: `board:${boardId}:presence`, event: 'set', data: [] }
]);
}); Throttle high-frequency publishes
For mouse movement, scroll tracking, or drag operations:
export const move = live((ctx, x, y) => {
ctx.publishThrottled('positions', 'update', {
key: ctx.user.id, x, y
}, 50); // 20 updates/sec max
}); Renamed from
ctx.throttle/ctx.debouncein 0.5.9. Old names still work as soft-deprecated aliases. Seectx.publishThrottled.
For high-frequency one-way RPCs (cursor moves, drag updates, typing indicators), see volatile RPC - skips the Promise + dedup-map + timeout entirely on the client.
Performance guidelines
- Use
ctx.publishThrottled()for high-frequency server publishes (cursors, positions) - Use
.fireAndForget()onlive.volatile()handlers when the caller doesn’t need the result - Use client-side
batch()when making multiple RPCs together - Use
ctx.batch()when publishing multiple events from one handler - Use
merge: 'set'for single values - cheaper thancrudfor simple state
Was this page helpful?