OpenUI: The Generative UI Framework That Uses 67% Fewer Tokens Than JSON

If you’ve ever built a chat interface that renders structured UI from an LLM — charts, tables, forms — you’ve probably wrestled with JSON. It’s verbose, it doesn’t stream well, and it burns through tokens like nobody’s business. OpenUI by Thesys is an open-source framework that tackles this head-on with a purpose-built language called OpenUI Lang, achieving up to 67% fewer tokens than equivalent JSON representations.

The Problem with JSON for Generative UI

Most generative UI approaches today ask the model to output JSON describing component trees. This works, but it has real costs:

• Token bloat. JSON’s syntax overhead — curly braces, quotes around every key, commas, colons — adds up fast. A contact form that takes 893 tokens in Vercel’s JSON-render format needs only 294 tokens in OpenUI Lang.
• Streaming friction. JSON isn’t designed for incremental parsing. You can’t meaningfully render a half-complete JSON object, so users stare at a loading spinner until the full response arrives.
• No component constraints. Without a formal schema, models hallucinate components that don’t exist, nest things incorrectly, or generate subtly malformed structures.

OpenUI addresses all three.

What OpenUI Lang Actually Is

OpenUI Lang is a compact markup language designed specifically for LLM output. It’s not HTML, not JSX, not YAML — it’s a new syntax optimized for two things: minimal token count and streaming parseability.

The framework’s benchmarks, measured with tiktoken against the GPT-5 encoder, tell the story clearly:

Scenario	Vercel JSON	OpenUI Lang	Savings
Contact form	893 tokens	294 tokens	-67.1%
Simple table	340 tokens	148 tokens	-56.5%
Dashboard	2,247 tokens	1,226 tokens	-45.4%
E-commerce product	2,449 tokens	1,166 tokens	-52.4%
Total (7 scenarios)	10,180	4,800	-52.8%

Across seven real-world UI scenarios, OpenUI Lang uses roughly half the tokens. For production applications making thousands of LLM calls daily, that’s a significant cost reduction.

How It Works

The architecture follows a clean pipeline:

1. Define your component library — or use OpenUI’s built-in ones (charts, forms, tables, layouts).
2. Generate a system prompt from that library — the framework automatically creates instructions telling the model what components are available and how to use them.
3. Stream the model’s OpenUI Lang output to the client.
4. Render progressively — OpenUI’s React renderer parses and displays components as tokens arrive, not after the full response completes.

This prompt-generation step is particularly clever. Instead of manually writing system prompts that describe your UI components (and hoping the model follows them), OpenUI derives the prompt directly from your component definitions, including their Zod-validated prop schemas. The model can only generate components you’ve registered, with the correct props.

The Developer Experience

Getting started is a single command:

npx @openuidev/cli@latest create --name genui-chat-app

This scaffolds a Next.js app with streaming, OpenUI Lang support, and a working chat interface. The framework is split into focused packages: @openuidev/react-lang for the core parser and renderer, @openuidev/react-headless for chat state management, and @openuidev/react-ui for prebuilt layouts and two component libraries.

The project also ships an Agent Skill so AI coding assistants like Claude Code and Cursor can help you build OpenUI apps — a nice meta touch for a framework designed around AI output.

Who Should Care

OpenUI is most relevant if you’re building:

• AI assistants that need to render rich UI (not just markdown) in their responses
• Copilot experiences where the model generates interactive forms, data visualizations, or product cards
• Any application where LLM-generated UI costs are a concern at scale

The 50-67% token savings compound quickly. If your assistant generates UI in every response and handles thousands of users, switching from JSON to OpenUI Lang could meaningfully reduce your inference costs.

The Broader Trend

OpenUI sits at the intersection of two accelerating trends: models getting better at structured output, and developers needing richer ways to surface that output. We’ve moved from plain text to markdown to tool calls to generative UI — each step giving models more expressive power in how they communicate with users.

What makes OpenUI interesting isn’t just the token efficiency (though that’s the headline number). It’s the full-stack approach: a language designed for models, a renderer designed for streaming, and a component system that keeps the model’s output constrained and predictable.

The project is MIT-licensed, actively maintained, and already trending on GitHub with over 5,000 stars. If you’re building generative UI and still using JSON, it’s worth a look.

Links: GitHub · Documentation · Playground · Discord