sigil-web-client

Client-side WASM UI framework for Sigil. A react-like rendering layer for browser applications compiled to WebAssembly: it renders Sigil SXML into the browser DOM and keeps application code independent of the underlying WASM DOM bridge.

(sigil web client) is the browser-side counterpart to the server-side sigil-web framework. The two are orthogonal: this library imports only sigil-wasm-dom and shares no code with the server-side modules.

Usage

(import (sigil web client))

;; Look up a DOM root by selector
(define root (web-client-root "#app"))

;; Mount a view: SXML, or a nullary procedure returning SXML
(web-client-mount root (lambda () `(div "Hello, world!")))

;; Update the mounted view in place
(web-client-update root (lambda () `(div "Updated!")))

;; Clear a root
(web-client-clear root)

Memoized subtrees

Use web-client-memo when a rendered subtree is immutable for a known revision:

(web-client-memo
  turn-id turn-revision
  (lambda ()
    `(section ,@(render-completed-turn turn))))

When a later web-client-update produces the same key and revision, reconciliation retains that element's complete DOM subtree without evaluating the producer or walking its attributes and descendants. A changed revision evaluates the producer and resumes normal reconciliation. The key and revision are renderer metadata and are not written to the DOM.

Memoized content must be immutable for the lifetime of its revision, including event handlers and attributes on the boundary element. Use this for stable, expensive regions while leaving actively changing siblings unmemoized.

Exports

• web-client-root — look up a DOM root node by selector
• web-client-root? — validate a root node handle
• web-client-render — render a view (an SXML value, or a nullary procedure returning one)
• web-client-mount — mount a view into a root
• web-client-update — update a mounted view in place; returns #f without mutating when retained children no longer match the DOM (call web-client-clear to recover from out-of-band changes)
• web-client-clear — clear a root
• web-client-reset! — reset retained client state

Building

This is a browser/WASM library. Build it into a web application with the web config:

sigil deps install
sigil build --config web

License

BSD-3-Clause