Composer Reference Guide R3-2026-2.7.9774.35170-prerelease

Web Page (Chromium, Windows)

Web Page (Chromium, Windows)

Renders a live web page as a video and audio source using a Windows-native Chromium-based browser (CefSharp). Point it at any HTTP/HTTPS URL — graphics overlays, scoreboards, dashboards, social-media feeds, or any other browser-renderable content — and Composer captures the page as a layer it can mix with the rest of the project. Includes auto-start on load, automatic reload on error, configurable resolution, scroll-bar control, and optional forwarding of the page's JavaScript console output to the log. Captures both video and audio from the page; page audio starts on its own, without the click a normal browser would require. Windows-only; for Linux or other platforms, use the cross-platform Web Page input instead.

Web Page (Chromium, Windows) - Settings

General
Property Description
Show advanced options Show or hide the input's advanced settings in the editor UI. [default=false].
Url HTTP or HTTPS URL of the web page to render. Set to any standard web URL. Changing this from a script lets you swap the rendered page at runtime — handy for cycling through dashboards, scoreboards, or status pages. Set to an empty string to clear the page.
Reload page url Reload the current page.
Cef renderer load state Current browser state (read-only). Reflects whether the browser is idle, loading, or actively rendering. Driven indirectly by StartCommand, StopCommand, ReloadCommand, and the AutoStart behaviour at load time. Read this from a script to decide whether the page is live.

Dimensions

Dimensions — width and height of the rendered page.

Dimensions
Property Description
Renderer width Width of the rendered page, in pixels. [min=32, max=4096, default=1024]. Acts like the browser's viewport width. Pages adapt their layout to this size, so set it to match how you want the page to render.
Renderer height Height of the rendered page, in pixels. [min=32, max=4096, default=360]. Acts like the browser's viewport height. Pages adapt their layout to this size, so set it to match how you want the page to render.

Scrollbar

Scrollbar — programmatically scroll the rendered page.

Scrollbar
Property Description
ScrollBar X-Pos Horizontal scroll position of the page, in pixels. [min=0, max=50000, default=0]. Scrolls the rendered page left or right to a specific position. Useful for showing part of a wide page that wouldn't otherwise fit. Setting this calls window.scrollTo inside the page.
ScrollBar Y-Pos Vertical scroll position of the page, in pixels. [min=0, max=50000, default=0]. Scrolls the rendered page up or down to a specific position. Useful for revealing content lower on the page or for animating a scroll over time from a script. Setting this calls window.scrollTo inside the page.

Commands

Commands — start, stop, and reload the browser.

Commands
Property Description
Start page rendering Start loading the URL and rendering the page.
Stop page rendering Stop rendering the page.

Configuration

Configuration — load-time and rendering options.

Configuration
Property Description
Start rendering when loaded Whether the input starts rendering as soon as the project loads. [default=false]. When true, the input invokes its start logic immediately on load (equivalent to running StartCommand). Disable to require an explicit start, useful when the page should only come live on operator action or via a script trigger.
Auto reload page on error (advanced) Whether the page is automatically reloaded after a load error. [default=false]. When true, a failed load is retried automatically. Useful when the source server may be temporarily unavailable. Disable for one-shot loads that should not retry.
Enable web page console logging (advanced) Whether messages logged by the page's JavaScript are written to Composer's log. [default=false]. Useful for debugging custom HTML overlays — console.log calls from the page show up alongside Composer's other log messages.

Performance and properties

Performance and properties — runtime stats from the browser.

Performance and properties
Property Description
Video queue size Number of rendered frames currently buffered ahead of playback (read-only, debug). Should sit close to zero on a healthy system. A growing queue means the rest of the pipeline is consuming frames more slowly than the browser is producing them.
Page render performance Recent per-frame rendering time, formatted as a millisecond string (read-only). Useful while monitoring how heavy the page is to render. Pages with complex animations or video elements take longer to render than static pages.

Inherits from: AbstractInput, AbstractAudioProcessing, AbstractAudioMetering, NamedModel.

See also: Web Page (Chromium, Windows) in Script Engine Objects.

Shared input properties

Every input — regardless of source type — exposes the following property groups. They are surfaced in the property panel only when Show advanced options is enabled on the input.

Icon

  • Icon text — short text shown on the input's icon in the Inputs list. Useful as a quick visual label (channel number, mic name, camera position) to tell otherwise-similar inputs apart at a glance. Empty by default; has no effect on rendering or routing.

Audio mixer

  • Hide in audio mixer — when on, hides the input from the audio mixer view without disabling its audio. Useful for de-cluttering the mixer while keeping the audio routed (e.g. fixed background music, ambient beds, pre-aligned playout). [default=false]

Render Options

  • Invisible (Do not render in scene) — when on, the input is skipped during rendering and produces no picture on any layer or scene. Audio routing is unaffected. Toggle from a script for cued-in / cued-out behaviour during a show. [default=false]
  • Do not render input — disables the input's internal render entirely (no decode or capture work is done). Stronger than Invisible: that one renders but doesn't display; this one stops the input from doing any work at all. Useful for reducing CPU / network load on heavy sources (e.g. high-bitrate RTMP / SRT streams, large media files) when the input is temporarily not needed. Audio meters are cleared while disabled. [default=false]
  • Do not render input controller — chooses what drives the Do not render input flag. Let Composer decide (the default) hands control to the project-level Render Tuning optimiser, which automatically pauses inputs that aren't used by any active scene. Manual Configuration ignores Render Tuning and lets the Do not render input toggle control the flag directly — use this to keep a network source warm even when it's currently off-air, or to take a heavy input down by hand regardless of scene activity. [default=Let Composer decide]

Optional TAGS

  • TAGS — one or more free-form tag words used to classify this input (typically space- or comma-separated). Picked up by Composer's Smart Search to filter or find inputs by category — e.g. camera, music, interview, sponsor. Has no effect on rendering.

Audio configuration and processing options

For inputs capable of processing audio, additional audio configuration and processing options are available through the audio mixer and the Channel Strip Inspector.

  • Audio mixer — monitor levels, adjust gain and pan, mute / solo inputs, and configure auxiliary sends to Audio Channel Strip submix buses, all from a centralised mixer-style interface.
  • Channel Strip Inspector — advanced per-strip audio processing for the selected input:
    • Input trim, stereo remapping, and audio delay
    • Channel mapping (8-channel mode unlocks the full MAPPING tab)
    • Gate (attenuates audio below a threshold to clean up room tone and bleed between phrases)
    • Low-cut filter (high-pass filter that rolls off rumble, plosives, and HVAC hum below a chosen cutoff)
    • Equaliser (5-band parametric)
    • Compressor (narrows dynamic range so the source sits at a steadier level in the mix)
    • Sidechain ducking (a second compressor whose gain reduction is driven by another input's level — e.g. dipping music under a voice-over)
    • Limiter (brick-wall ceiling that catches peaks to prevent clipping at the end of the chain)
    • Automixer (per-mic Use automixer toggle and weighting for gain-sharing across a group of live mics)
  • Automixer window — a mixer-style overview of every input with the gain-sharing automixer enabled, with per-mic gain, weight, and bypass plus group-wide envelope and noise-floor overrides from a single panel.

For the full audio signal flow, see Audio processing workflow.

How to play audio

Composer renders your page using its own built-in copy of Chrome, and captures the page's sound as well as its picture. That built-in copy is set up differently from the Chrome on your desktop, and sound is where the two differ:

  • In Composer — the sound starts by itself the moment the page loads. Nothing has to be clicked.
  • In Chrome on your desktop — the same page stays silent. Chrome does not let a page play sound until someone clicks it.

A page built correctly for Composer is therefore silent when you open it in Chrome. That is expected, and it is not a fault.

Why Chrome blocks audio by default

Web pages were once free to play sound the instant they opened. Unwanted autoplaying media led browsers to add an audio block that still applies today:

A page may not play sound until the viewer interacts with it — a click, a key press, or a tap. Control over playback belongs to the viewer, not to the page.

Chrome applies this to every page it opens, including pages loaded from a local file.

Composer's built-in copy of Chrome runs with the audio block switched off. A page rendered inside Composer has nobody to interact with it, so a page that waits for a click would never produce sound. Audio is allowed from the moment the page loads instead.

Do not make the page wait for a click

Because Chrome waits for that interaction, a page built and tested in Chrome often starts its playback from a click:

<audio id="theme" src="theme.mp3" loop></audio>

<script>
  // Chrome: plays after a click. Composer: silent.
  document.addEventListener('click', function () {
      document.getElementById('theme').play();
  });
</script>

Inside Composer nobody clicks the page, so play() is never called and the page stays silent. Nothing on the page looks wrong, which makes this easy to miss.

Start the sound without a click

Let the media start itself. The autoplay attribute is all it takes — no script at all:

<!-- Composer: plays with sound. Chrome: silent. -->
<audio src="theme.mp3" autoplay loop></audio>

Video works the same way, and carries its picture into the scene along with the sound:

<!-- Composer: picture and sound. Chrome: nothing starts. -->
<video src="clip.mp4" autoplay loop></video>

Composer is the only place the page has to work, so autoplay is the correct choice. Adding a click handler to satisfy Chrome would bring back the silence in Composer. To hear the page in Chrome while you build it, see Testing the sound in Chrome below.

Testing the sound in Chrome

Chrome can be started with its audio block switched off, so a page sounds exactly as it will in Composer. There is no setting for this in Chrome itself — it has to be given when Chrome starts.

  1. Close every Chrome window. This matters — if one is left open, the command below simply opens another window in the Chrome already running, and the option is ignored.

  2. Press Windows + R to open the Run box.

  3. Paste the line below and press Enter.

    "C:\Program Files\Google\Chrome\Application\chrome.exe" --autoplay-policy=no-user-gesture-required

  4. Open your page in the window that appears — drag the HTML file onto it, or press Ctrl + O and pick the file.

Chrome now behaves like Composer's built-in copy: the page plays its sound as soon as it loads, and does so again every time you reload after an edit.

If the page is still silent, open chrome://version and look at the Command Line row. It lists the options Chrome started with. If --autoplay-policy is not among them, a Chrome window was still open when you ran the command — close them all and try again.