The renderer

The renderer is the HTML5 page that produces the on-air image. It runs in the browser that captures the output URL — usually a browser source inside a broadcast tool.

What it does

• Connects to the server over WebSocket and joins the output's channel.
• Receives commands (Take, Out, Pause, Continue, row change, data change) in real time.
• Renders the current state of every live layer into an HTML canvas.
• Plays animations, loops, pause sequences.
• Keeps a transparent background so the broadcast tool can overlay it.

Per-output, not per-template

One renderer instance serves all layers of whichever production is currently driving the output. Adding a layer to the production adds a DOM element; removing one tears it down.

No interactivity

The renderer does not accept clicks or keyboard input. All control happens via the control panel, which sends commands through the server. The renderer is a display surface; the control panel is the remote.

Resilience

• Temporary WebSocket hiccups leave the last state on screen and recover on reconnect.
• Reload the renderer's browser tab to reset cleanly. The control panel re-pushes the current state on reconnect.