Detir - UI runtime

HTML or IR.
One GPU runtime.

Run web apps in HTML mode or build structured interfaces in IR mode. Detir renders both on the GPU. Agents inspect UI state, read data documents and call actions through MCP.

DetirHTML mode / illustration

source

<section class="hero">

<h1>Ship faster</h1>

<p>One platform.</p>

<button>Get started</button>

</section>

rendered on wgpu

Ship faster

Get started
HTML → style + layout → GPU

What Detir does

Two modes. Built for people and agents.

Choose HTML for web content or IR for structured interfaces. The runtime brings rendering, semantic data and agent operations together.

HTML mode

Run web interfaces

HTML, CSS and JavaScript use Detir’s DOM, style and layout pipeline, including React apps within supported web capabilities.

IR mode

Render structured interfaces

Create views and semantic data directly in IR for host-driven or generated interfaces.

Rendering

Share the GPU foundation

Both paths use Detir’s Rust and wgpu rendering stack for text, shapes, images and interface composition.

Data documents

Give agents meaningful state

Separate interface presentation from semantic data. Apps can publish screens, entities and forms as MCP resources.

MCP

Discover and call actions

Agents discover registered app tools and use runtime UI tools to inspect and operate web interfaces.

Compatibility

Check against real pages

Computed style and layout are compared against Chrome. Web compatibility remains an active area of development.

Mode 01 / HTML

Bring your web app.

HTML mode runs HTML, CSS and JavaScript through Detir’s web runtime. The host DOM and CSSOM own the page state; style and layout produce the content the GPU renderer paints. React apps use this path, with compatibility checked against real pages.
  • HTML, CSS and JavaScript through the web standards path
  • DOM events and form state stay in the live web runtime
  • GPU rendering without embedding Chromium
DetirHTML mode / illustration

source

<section class="hero">

<h1>Ship faster</h1>

<p>One platform.</p>

<button>Get started</button>

</section>

rendered on wgpu

Ship faster

Get started
HTML → style + layout → GPU

Mode 02 / IR

Build with structured views and data.

IR mode takes an intermediate representation directly. A view document describes the interface; a data document carries semantic content and bindings. Host code can create and update these structures for native or generated interfaces, using Detir’s shared GPU rendering foundation.
  • Structured view nodes define the interface
  • Data nodes describe content, actions and bindings
  • Direct updates through the IR path
Data documentillustrative example
{
  "document_id": "welcome",
  "nodes": [
    {
      "node_id": "title",
      "kind": "text",
      "text": "Welcome"
    }
  ],
  "bindings": [],
  "channels": []
}

An illustrative native IR data document. Semantic content is keyed by node ID; view nodes reference the data they present.

Choose your mode

Choose how your interface runs.

Choose the path that matches how your interface is authored. HTML mode keeps web semantics in the web runtime. IR mode works directly with structured views and data.

HTML modeIR mode
Start withHTML, CSS and JavaScriptStructured view and data documents
Interface stateHost DOM, CSSOM and live form stateIR view nodes, semantic data and bindings
UpdatesDOM operations and web eventsDirect IR mutations from host code
Rendering pathWeb style and layout into GPU renderingStructured views into GPU rendering
Use it forWeb pages and framework-based appsNative structured or generated interfaces

Both modes use Detir’s Rust and wgpu rendering foundation. Their document models and update paths are distinct; HTML apps do not need to be rewritten as IR packages.

Under the hood

How agents work with Detir.

MCP connects agents to the running app. Data documents supply meaningful context, registered tools expose app actions, and runtime UI tools operate web interfaces. Rendering mode and agent access are separate parts of the runtime.

Discover, read, act, check

An agent discovers the tools and resources available in its runtime session, reads the relevant state, calls an operation and checks the result. A successful tool call can be followed by another resource read or UI snapshot.

01

Discover

List tools and resources

02

Read

App data or live UI state

03

Act

Call an available MCP tool

04

Check

Read the resulting state

Data documents / meaningful context

Detir separates presentation from semantic data. In HTML mode, semantic state includes labels, links and form values associated with UI nodes. A WAID app can also publish a data document containing its current screen, entities and forms. MCP exposes those published values as individually readable resources.

Data documentillustrative example
{
  "appId": "example-app",
  "screen": "/items",
  "entities": {
    "item-1": {
      "id": "item-1",
      "status": "draft"
    }
  },
  "forms": {
    "editor": {
      "fields": {
        "title": "Example"
      }
    }
  }
}

An illustrative app-published data document. In the WAID host, an app registers the screen, entities and forms it wants to expose. This is separate from the native IR document schema.

App actions / MCP tools

Apps register callable actions with descriptions and input schemas. tools/list exposes the live catalog; tools/call invokes an app_id:action tool and returns its result or error. Catalog changes tell the agent to refresh discovery.

App action discoveryMCP
tools/list
  Discover registered actions
  Read each input schema

tools/call
  Name: app_id:action
  Arguments: match its schema

Result or error
  Read state again to verify

UI operations / built-in tools

For web interfaces, ui:snapshot and ui:read_node expose live nodes, text, values and bounds. Agents can then focus, click, type or set values by node ID. These operations use the runtime’s normal input and event paths.

Runtime UI toolsMCP
ui:snapshot / ui:read_node
  Inspect the live interface

ui:click / ui:focus
ui:type_text / ui:set_value
ui:press_key / ui:scroll_into_view
  Operate a discovered node

ui:snapshot
  Check the updated interface

Connected to the running app

The MCP dispatcher supports in-process calls, headless stdio serving and local-socket connections, including attachment to a running windowed app. Screenshots require a rendered windowed frame. Available actions and UI operations depend on the app, host and configured grants.

MCP toolsMCP resourcesApp dataLive UI state

Agent observations describe state. In HTML mode, updates still go through app actions or live DOM events; reading a data document does not make it a writable page model.

HTML compatibility / recorded snapshot

Computed style and layout are compared against Chrome on a defined page corpus. The figures below retain the recorded benchmark scope; they are not a claim of full browser parity.

183

deviations yet to be covered

in the recorded comparison

480

nodes compared

the scope of that snapshot

159

width / height deviations

within the recorded total

Ongoing

web compatibility work

real-page checks guide coverage

183 deviations yet to be covered

Request access

Your interface. Your mode. Agent access built in.

Tell us about your HTML application, structured IR interface or agent workflow. We will help you evaluate the right rendering path and show how agent access fits into it.