The chat UX is the product, not the model

Users don't churn over your model. They churn over the chat experience around it. Same model, two products: one feels alive, the other fights you on every scroll. The difference is craft nobody puts on the roadmap.

shadcn just published 15 rules for a great streaming chat experience. They are good. Read together, they point at something bigger than scroll.

The one rule under all fifteen

Every item on that list reduces to a single principle: never move the reader against their intent.

Auto-scroll by default is the bug, not the feature. Follow the stream only while the reader is following it. The moment they scroll up, select text, open a link, or touch the keyboard, that is intent. Stop moving. The interface should never drag attention somewhere the reader did not ask to go.

Scroll is the visible tip

shadcn calls it scroll engineering. Scroll is just the part you can see. The same principle governs the whole turn.

Keep enough of the previous answer on screen that people know where they are. Start each new turn near the top so it can be read from the beginning. Pace the stream so it is fast but not frantic. Let new content arrive offscreen without yanking the viewport. This is layout under motion, and most chat UIs get it wrong because they were built as a div that appends text.

The hard part is interruptions

Streaming is easy when nothing goes wrong. The craft shows up when it does.

Stop, retry, regenerate, branch, error. None of those should steal the reader's position. Reopening a saved conversation should land on the last meaningful turn, usually the user's last message, not the absolute bottom of a 200-message log. Images load, markdown expands, code blocks render, older messages page in above - and through all of it the reader should keep their place. That is the line between an app that respects attention and one that resets it.

Even the terminal fights this

This is not a web problem. It is a chat problem, and it follows the format anywhere chat goes.

Claude Code runs in a terminal and fights the exact same battle: scrollback you can trust, a way to jump back to the latest output, keeping your place while tokens stream in, announcing what is happening without drowning you in noise. No React, no virtualized list, same discipline. The surface changes. The craft does not.

Why nobody staffs it

Here is why this matters more than it looks. Everyone now rents the same frontier models. Your competitor is one API key away from the same intelligence you have. The model is not where you win.

The chat experience around the model is the part you own and the part users feel on every single turn. It is also the part nobody assigns an owner. There is a prompt engineer, a model eval, a RAG pipeline - and the scroll position gets handled by whoever touched the component last.

A bigger model won't save you here, and your homepage won't either if the product behind it jitters.

The model is rented. The chat is yours. Build it like it matters, because it is the only part of the stack your users actually touch.

Glossary

Terms

Evals

Repeatable tests for an AI system: feed it inputs, score the outputs against a standard, and compare runs. They show whether a change actually helped or hurt.

Frontier model

One of the most capable AI models available at a given moment, from the leading labs. What counts as frontier keeps moving as newer models arrive.

Retrieval-augmented generation

A setup where the system first looks up relevant documents and puts them in the prompt, so the model answers from fresh, specific sources instead of memory alone.

Token (LLM)

The chunk of text, often a word or part of a word, that a language model reads and writes. Context limits and pricing are counted in tokens, so they measure how much text a model handles.

Tools

Claude Code

Anthropic's agentic coding tool that reads a codebase, edits files and runs commands, in the terminal, IDEs, a desktop app and the web.

React

A JavaScript library for building user interfaces out of components. It is maintained by Meta and an open-source community.

shadcn

A set of accessible React components you copy into your own project as source code, so you can customize them and build your own component library.