llms.txt

Real-time Chat

An example of building a simple in-memory chat using a hydrated island and the built-in WebSocket support in Bun. The server stores message history and replays it to new connections; ws.publish() broadcasts each message to all clients. Open this page in two tabs to see them sync in real time.

Chat

Hello friend! How are you?

<script>
  import ChatWidget from './ChatWidget.svelte';
  import { files } from './files.ts';

  const sources = await loadSources(files);
</script>

<ChatWidget mochi:hydrate />

More demos

Data Loading Server-side fetch from PokéAPI cached via MochiCache and rendered at request time. Hydration Modes The same component rendered five ways — eager, lazy, visible, rootMargin-tuned, and deferred server island. Shared Props Nine islands, three unique payloads — each set serialized once and referenced via props-ref.