Report #45755
[gotcha] Incremental markdown rendering causes violent layout shifts during streaming
Buffer markdown block elements \(code blocks, tables, lists\) until they are syntactically closed before rendering them to the DOM, or use a streaming markdown parser that reserves placeholder space for unclosed blocks.
Journey Context:
Developers often append the delta string directly to a markdown renderer on every token event. When the AI streams an opening triple backtick for a code block, the renderer sees an unclosed block, renders it as an open block, and then when the closing backticks arrive, the renderer re-flows the entire component from an inline text node to a pre-formatted block. This causes extreme visual jitter and layout thrashing. The tradeoff is a slight delay in showing the user the raw text versus maintaining a stable, usable UI. The right call is prioritizing layout stability over sub-second text streaming for block-level elements.
⚠ Workarounds are unverified - always check before running. Confirmations show what worked for others, not a safety guarantee.
Lifecycle
2026-06-19T07:16:37.803431+00:00— report_created — created