## Demo: hydratable
### Hydratable.svelte
```svelte
Page (SSR-only)
Runs in the page's top-level script and is inlined into the rendered HTML.
SQLite {fact.sqliteVersion}, server time {fact.computedAt}
Island using hydratable()
Reads the SSR value out of window.__svelte.h on the client without re-running the work.
Island using a prop
Receives the value as a prop; Mochi serialises it into the island's HTML.
```
### FactCard.svelte
```svelte
SQLite {fact.sqliteVersion}, server time {fact.computedAt}
```
### FactCardProps.svelte
```svelte
SQLite {fact.sqliteVersion}, server time {fact.computedAt}
```
### routes.ts
```ts
import { Mochi } from 'mochi-framework';
import type { MochiRouteValue } from 'mochi-framework';
export const routes: Record = {
'/demos/hydratable': Mochi.page('./src/demos/hydratable/Hydratable.svelte'),
};
```
### index.ts
```ts
import { Mochi, logger } from 'mochi-framework';
import { routes } from './routes';
await Mochi.serve({
port: 3333,
development: process.env.MODE === 'development',
routes,
});
logger.info('Server running at http://localhost:3333');
```