awesome-everything RU
↑ Back to the climb

AI / LLM Integration

Streaming: code and stream reading

Crux Read real SSE-parsing and streaming-client snippets, predict the behaviour, and pick the highest-leverage fix — event framing, delta accumulation, client abort, and partial-JSON tool args.
Your altitude — climbing toward senior
ZeroJuniorMiddleSenior
You are at senior altitude — in orbit
◷ 14 min

The SSE parser, the accumulator, and the abort path are where streaming bugs actually live. Read each snippet, predict what it does under real traffic, then choose the fix a senior engineer makes first.

Goal

Practise the loop you run on every streaming incident: read the parsing and client code, predict where it corrupts or hangs, and reach for the framing/accumulation/cancellation fix rather than blaming the model.

Snippet 1 — the SSE frame parser

const reader = res.body.getReader();
const decoder = new TextDecoder();
while (true) {
  const { value, done } = await reader.read();
  if (done) break;
  const text = decoder.decode(value);      // one network chunk
  for (const line of text.split("\n")) {
    if (line.startsWith("data: ")) {
      const evt = JSON.parse(line.slice(6)); // parse immediately
      handle(evt);
    }
  }
}
Quiz

This parser works in dev but throws JSON.parse errors under load. What is the bug, and the fix?

Snippet 2 — the delta accumulator

let text = "";
const toolArgs = {};                 // index -> string buffer
function handle(evt) {
  if (evt.type === "content_block_delta") {
    if (evt.delta.type === "text_delta") {
      text += evt.delta.text;
      render(text);
    } else if (evt.delta.type === "input_json_delta") {
      const i = evt.index;
      toolArgs[i] = JSON.parse(toolArgs[i] + evt.delta.partial_json); // (!)
    }
  }
}
Quiz

The text path is correct. What is wrong with the tool-argument path?

Snippet 3 — client cancellation

function ask(prompt) {
  return fetch("/api/chat", {
    method: "POST",
    body: JSON.stringify({ prompt }),
  }).then(consumeStream);
}
// User clicks "Stop". The UI stops rendering tokens.
// But the server keeps generating, and billing keeps counting.
Quiz

Clicking Stop hides tokens but the model keeps generating and you keep paying. What is the correct fix end-to-end?

Snippet 4 — server backpressure

// Express-style SSE endpoint proxying an upstream model stream
for await (const evt of upstreamStream) {
  res.write(`data: ${JSON.stringify(evt)}\n\n`); // ignore return value
}
res.end();
Quiz

A slow client (mobile, weak signal) consumes events slower than the upstream produces them. What does this loop do, and what is the fix?

Recap

Every streaming bug is read in the parser, the accumulator, the abort path, or the write loop: SSE frames must be buffered and split on the blank-line delimiter because TCP chunks don’t align with events; tool-arg input_json_delta fragments accumulate as a string and parse only at content_block_stop; client Stop must drive an AbortController whose signal propagates to the upstream provider or you keep generating and paying; and a server proxying a stream must honor write()‘s false return (pause upstream, resume on drain) or a slow client balloons memory. Read the code path, predict the failure under real traffic, fix the framing/cancellation/backpressure — then re-test against a slow, flaky client.

Continue the climb ↑Streaming: build a robust streaming endpoint and client
shortcuts expand
search
K
prev piece
k
next piece
j
cycle tier
t
this menu
?
sources2
expand
  1. 01
  2. 02

Trademarks belong to their respective owners. Editorial reference only.