Foundation 05

Load the first page on the server

Use the active session and tenant context in a SvelteKit server load, return serializable rows, and let the browser take over only when the page needs to stay live.

Web collection

Server loadHydrationSSEIndexedDBSync

Server rows become a live browser collection without another first fetch.

Keep initial reads in server load

The server can use the database, signed session, tenant, and permission snapshot directly. Return only the fields the page needs.

src/routes/+page.server.ts

typescript

export const load = async ({ depends, locals }) => {
  depends('smrt:items');
  if (!locals.permissions.includes('items.read')) return { items: [] };

  const items = await getCollection<Item>('Item');
  const rows = await items.list({ limit: 50 });
  return { items: rows.map(({ id, title, status }) => ({ id, title, status })) };
};

Add a browser collection when the page needs it

Pass the server rows as initialData. The collection can then handle live invalidation, ETags, persistence, or offline writes without delaying the first render.

Use the shared application shell

AdminShell supplies responsive application chrome, tenant navigation, settings, focus tools, and activity surfaces. Domain packages can stay focused on their own working views.