Deterministic LLM UI Rendering in Phoenix LiveView
summary
Shows how Phoenix LiveView consumes LLM token streams, buffers tokens with GenServer buffering and emits only on word-boundary to avoid flicker, uses stream inserts for stable IDs, parses custom fenced Markdown blocks for code with copy button and for charts, sends chart specs to an ECharts plugin, and surfaces LLM tool calls as UI inputs via LangChain so suggestions, charts and ask-user forms render deterministically only when complete.
AI-written summary · about
chapters (7)
- 0:00LLM UI rendering in Phoenix
- 1:07Streaming LLM response challenges
- 4:38Flickering and partial blocks
- 7:31Custom components with markdown
- 12:45Interactive input widgets from LLM
- 16:38Deterministic LLM UI summary
- 18:22Q&A: Markdown parsing
related talks
01h 13mKeynote: Phoenix LiveView - Interactive Apps without Javascript
35mKeynote: Fireside Chat on LiveView, (...)
28mLobbying with Elixir: Real-Time LiveView and OTP
01h 00mFrom LLM Theory to Practical Agentic Implementations
29mTeaching LLMs New Tricks
34mIntroducing LiveData: LiveView for JSON endpoints
46mThe joy of building your startup with Phoenix LiveView
17mState isn't all you need, but It helps: building better LLM apps in the browser