Why does streaming agent UI still leave you rebuilding cards per
Streaming generative UI from an agent usually means building and maintaining a different message format for each platform. json-render with Chat SDK agents fixes this: the agent writes a JSON spec against a typed component catalog, and adapters post it natively.
What it is
json-render gives agents a typed catalog of components like tables, charts, and buttons. The agent emits a JSON spec that becomes a Chat SDK card, and each adapter renders it in the platform's native format, such as Block Kit on Slack or Adaptive Cards on Teams.
Applied case
A developer wiring a Chat SDK agent into Slack and Teams can stream a card with streamCard, which posts once the root element has content and updates as new elements arrive, throttled to one edit per 500 ms by default to match Chat SDK streaming. toCard validates every element's props against its component schema and throws CardSpecError with readable issues you can send back to the model for a corrected spec. The Slack adapter degrades content past platform caps, like turning a second table into a code block, unless you pass limits to reject those specs instead.
- Validate specs with toCard and return CardSpecError issues to the model for self-correction
When to use it
Use when your agent must deliver rich, validated UI across multiple chat platforms without bespoke message code. Skip when you only send plain text or a single fixed card shape.
Read more
Recommended for you
- QualityVercel
When to use AI Gateway web tools instead of a bespoke search stack?
Wiring per-provider web search into your agent means separate accounts, keys, and fallback code that breaks when you switch models.
- QualityVercel
How I stop throwaway Vercel demos piling up without manual deletes
Prototype and test apps pile up in your Vercel account until someone remembers to delete them by hand.
- QualityClaude Code
Why do juniors build what already exists while seniors skip it?
Juniors build what already exists; seniors skip it. The laziest solution that works is the right one. Real examples in code, plus a decision ladder.
- QualityClaude Code
When should you reject an agent PR that splits one file into six?
The agent's PR has six new files for one small feature. A utils file for one function. A types file for two interfaces. None of it earns its keep.
Enjoyed this article?
Subscribe for new articles. No spam. Unsubscribe anytime.