<web/static>

Renders apps ahead of time, for pages built at build time or on a server. The Vite plugin uses it to fill a server entry's children and assets.

Exports

let
  inherit (import <web/static>) render;
in
render (import ./app)

render#

Signature

render app

Renders app as it first mounts: its render given init, or { } if it has no state. Returns:

children: the rendered nodes, normalized as <web/dom> children are.
styles: the CSS the nodes need, as a string. The app's global styles come first, in @layer base, then each class in children once, in tree order, in @layer components.

src/page.nix

{ ... }:
let
  inherit (import <web/dom>) html;
  inherit (import <web/static>) render;
  app = render (import ./app);
in
html.html { lang = "en"; } [
  (html.head (html.style app.styles))
  (html.body (html.div { id = "app"; } app.children))
]

Event handlers have nothing to run them, so they're left out of the HTML. Mounting the app into the container replaces what was rendered.

Different styles that hash to the same class name throw.