Reactive Updates

Type a name and press Save — the breadcrumb updates before the server replies. Hard-reload to see the stored value.

Breadcrumb reads from a remote query

The breadcrumb calls getNickname() — a server-side query faking a database read.

<script module lang="ts">
	import { getNickname } from '$lib/demo/greeting.remote.js';
	
	export const breadcrumb: BreadcrumbMeta = async () => ({
	  label: await getNickname()
	});
</script>

Optimistic update via command

On save, a command writes to the server while .withOverride() updates the breadcrumb instantly — no round-trip.

<script lang="ts">
  function save() {
    setNickname(input).updates(
      getNickname().withOverride(() => input || 'Visitor')
    );
  }
</script>