Lace examples

Shared Todo List

This example is a small browser todo application over Lace’s generic JavaScript runtime. It uses ordinary records and policy rather than a todo-specific command protocol:

The browser UI has no JavaScript dependencies. It imports the Lace browser bundle from js/crates/lace-js/dist/ in a source checkout. Build that bundle from source before serving the UI.

Demo authority

The static demo includes demo-only authority material so a browser can mint its own local member grant:

authority By-secret value: &.1lS71lS71lS71lS71lS71lS71lS71lS71lS71lS71lS.H3
authority key:       V.8qgOfsaEJkK1tzX51sTT9NKdM8J2SrzQq6k8cRPzvP0.H3

This is intentionally not production identity or access control. Real applications must keep authority By-secret material out of static browser assets.

Prepare the browser bundle

rustup target add wasm32-unknown-unknown
npm --prefix js/crates/lace-js run build

Run the Lace endpoint

laced serves only the Lace WebSocket/ILTP endpoint. Serve static files with ordinary static infrastructure in a separate terminal.

cargo run -p laced -- --foreground --config examples/shared-todo-list/laced.conf

Serve the UI

The example uses ordinary static HTTP rather than a Lace-320 host. Its base Lace frontend publication coordinate is //u//shared-todo-list//index.html; an HTTP-compatible bundle would use //u//shared-todo-list/http//index.html.

From the repository root:

python3 -m http.server 8798 --bind 127.0.0.1

Open:

http://127.0.0.1:8798/examples/shared-todo-list/web/?lace=ws:127.0.0.1:8797/interlace

The lace query parameter is a Lace WebSocket address. The UI runs ordinary bounded WebSocket/ILTP interlace with the local Lace when it opens and after it stores a task.

What to try

Open the page in two browser profiles or two windows. Each browser creates a local By-secret value, creates member/task records with Record.create({...}), stores a demo authority member grant through the public store(...) API, runs a WebSocket interlace with the laced endpoint, and renders validated todo/task records. Create a task in one window; after bounded interlace drains advertisement/request output and reaches the fixed point, the other window should display the marked task after its next sync.

Validation

npm --prefix js/crates/lace-js test
cargo test -p laced -p lace-tokio -p lace-single

A full smoke test also needs the manual browser flow above because it exercises the static UI, bundled WASM, WebSocket/ILTP, exposure, and record rendering together.