Agentic Rendering Protocol

The Problem ​

AI agents produce structured output — tables, forms, charts, status messages, code blocks — but the rendering of that output is tightly coupled to the transport and frontend framework. An agent built for a web chat cannot render on a desktop app. An agent behind an SSE stream cannot serve a mobile client expecting a different protocol.

Every new rendering surface requires custom integration code.

The Solution ​

ARP defines a protocol — not a framework, not a library. Like how Wayland decoupled applications from display servers, ARP decouples agents from renderers.

The agent decides what to display. The renderer decides how to display it.

Agent (backend)                              Renderer (web, CLI, mobile)
───────────────                              ──────────────────────────
Owns surfaces         ── render / delta ──►  Owns display
Owns UI state         ◄── input events ────  Owns input routing

Design Principles ​

Protocol Messages ​

Every ARP message is JSON with at minimum { v: 1, type: "<type>" }.

14 Built-in Components ​

Every ARP-conformant renderer must support at least text. Components declare fallback chains — chart falls back to table, which falls back to text.

Transports ​

Client SDKs ​

import { ArpClient } from '@haira/arp'

const client = new ArpClient('ws://localhost:8080/_arp/v1', {
  onDelta: (text) => appendToChat(text),
  onRender: (event) => renderComponent(event.component, event.props),
  onDone: () => markStreamComplete(),
})

client.connect()
client.sendText('Show me the sales data')

import { ArpChat } from '@haira/arp-react'

function App() {
  return (
    <ArpChat
      url="ws://localhost:8080/_arp/v1"
      theme="dark"
      title="Data Explorer"
    />
  )
}

Also available: @haira/arp-vue for Vue 3 and github.com/haira-lang/arp-go for Go backends.

Haira Integration ​

Every Haira server speaks ARP natively. No configuration needed.

import "ui"

tool query_database(query: string) -> any {
    """Executes a SQL query and displays results."""
    rows, err = postgres.query(db, query)
    if err != nil {
        return ui.status_card("error", "Query Failed", conv.to_string(err))
    }
    return ui.table("Query Results", headers, rows)
}

agent DataExplorer {
    provider: OpenAI
    tools: [query_database]
    ui: ui
}

@webhook("/chat")
workflow Chat(message: string, session_id: string) -> stream {
    return DataExplorer.stream(message, session: session_id)
}

Extension Lifecycle ​

New components follow a three-phase lifecycle inspired by Wayland:

Conformance Levels ​