Skip to content

perf(web-ui): virtualize inline diff and defer code preview highlighting#368

Merged
GCWing merged 1 commit intomainfrom
gcwing/dev
Apr 8, 2026
Merged

perf(web-ui): virtualize inline diff and defer code preview highlighting#368
GCWing merged 1 commit intomainfrom
gcwing/dev

Conversation

@GCWing
Copy link
Copy Markdown
Owner

@GCWing GCWing commented Apr 8, 2026

Summary

Improves flow chat code/diff preview performance during streaming and for large diffs.

Changes

  • InlineDiffPreview: Row virtualization via @tanstack/react-virtual; Prism tokenization once per side with lightweight per-line rendering (avoids many \SyntaxHighlighter\ instances).
  • CodePreview: \useDeferredValue\ for highlighted content so auto-scroll/cursor stay responsive while syntax tokenization yields to the main thread.

Testing

  • Manual: open a large inline diff in flow chat, scroll and verify highlight/virtualization.
  • Manual: stream a long code block and confirm preview stays usable.

- Add @tanstack/react-virtual for InlineDiffPreview row virtualization

- Tokenize diffs with prismjs once per side, render tokens without per-line SyntaxHighlighter

- Use useDeferredValue in CodePreview for smoother streaming syntax highlight
@GCWing GCWing merged commit 0d049ba into main Apr 8, 2026
4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant