Stream, stop, and replace a response

A typical browser sends a user request to an application backend. The backend authenticates the caller, checks access and limits, constructs the model request, and returns a response. Provider credentials belong in protected server configuration, never in browser code.

The browser controls presentation and user interaction. The backend controls authoritative conversation ownership, tool permissions, source eligibility, model access, and the saved record of each run. A hidden client-side button cannot enforce authorization because a caller can send requests directly.

For example, an interview-practice assistant might receive a learner's answer and return written feedback. The UI should distinguish the learner's submission, the generated feedback, and any score still under review.

A buffered response arrives as a complete result after processing. A streamed response arrives incrementally. Streaming can show progress and reduce perceived waiting, but it introduces partial state and interruption handling.

A transport chunk is not necessarily a model token, sentence, or application event. Network boundaries can split a UTF-8 character or combine several events. Decode bytes incrementally (a streaming text decoder holds the bytes of a split character until the rest arrive) and parse an explicit framing format. In the server-sent events format, each event is one or more field: value lines followed by a blank line:

One chunk may end halfway through the first data line, and the next may carry the rest of it plus the whole done event. The parser buffers text until it sees the blank line, then handles one complete event.

A stream ending does not automatically prove task completion. The application protocol should identify successful completion or an authoritative terminal status, such as the done event above. A dropped connection can look like an unexpected end.

Choose based on the interaction. A text-answer stream may need only server-to-client updates. Real-time audio or bidirectional collaboration may need a different transport. Transport selection alone does not implement persistence or reliable resumption.

Native EventSource always opens a GET request without a body or custom headers, and reconnects on its own, sending the last event ID it received when the server set one. To post the user's text, read a fetch response body and parse the same format, or create the run first and then open the stream.

Keep partial text when it helps the user, but label it accurately. Do not display a completed checkmark simply because some text arrived.

A browser can abort a fetch with AbortController. Calling abort() on the controller whose signal was passed to fetch() rejects the pending request, or errors a response body that is still being read, with an AbortError by default. This stops the client's operation. The server may need to detect disconnection or receive a separate cancellation request to stop upstream work.

Cancellation does not undo a tool action already completed. If the assistant sent a message or changed a record, stopping the visible stream cannot reverse that effect. Use authoritative operation state for final reporting.

The UI can acknowledge that the user stopped receiving output while separately checking whether the server run ended. Avoid promising that all provider processing or billing stopped instantly.

Assign a stable identity to each accepted run and distinguish new attempts. If a user stops one request and immediately starts another, late events from the old request must not modify the new answer. Late events happen in practice: a chunk already in flight, or a read that resolves just after the user pressed Stop, can still reach the event handler.

A message ID identifies a conversation item, while a run or attempt ID identifies the execution producing it. Keeping these separate supports retries, alternative answers, and reliable rendering.

A simple guard: apply a stream event only when its run ID matches the active run and that run is still streaming. A handler that appends to "the current message" without this check writes an old run's text into whatever message is current when the event lands. In React, a reducer can centralize these transitions and ignore stale events. Use stable message keys so incremental updates do not recreate unrelated components or move keyboard focus unexpectedly.

A request may fail before output, after partial output, or after backend completion but before the client sees the result. These cases need different handling.

Retrying generation creates a new answer attempt unless the server explicitly resumes the existing run. Do not append a new generation to old partial text as though it were a continuation. Preserve the earlier attempt or replace it deliberately with a clear label.

A reconnect can replay already-produced events or retrieve a final snapshot if the backend supports that contract. Automatic retry should not repeat side-effecting tool operations without the operation controls covered in Tool Calling & Agents.

Display citations using source metadata returned through a trusted mapping. The UI should show a useful title or section and handle a source that becomes unavailable. A model-generated arbitrary URL should not automatically become a trusted citation.

Partial Markdown can be syntactically incomplete. Use safe rendering and avoid enabling raw HTML or unapproved remote resources. The completed response should pass the application's validation before it is treated as authoritative structured data.

A citation marker shows attribution, not proof that the cited source supports the claim.

Keep Send and Stop keyboard-accessible with descriptive labels. Announce meaningful states such as generating, stopped, interrupted, and complete through a polite status region (role="status"). Announcing every token can overwhelm screen-reader users.

Preserve focus while content updates. If a control disappears when it is used, as Stop often does, move focus to a sensible neighbor such as the input or Send; otherwise focus falls back to the page body, and keyboard and screen-reader users lose their place. Auto-scroll only when the user is already following the bottom or has opted in. If the user scrolls upward to read, provide a new-content indicator instead of pulling them back down.

Provide a readable completed transcript and an alternative way to obtain the final response when streaming is unavailable. Test long code blocks, narrow screens, zoom, and keyboard navigation.

Use the platform facts and the timeline in the scenario, and the states in "Make state visible".