bashrusakh
59ecd86b4b
Reworks the chat and session-sidebar render paths to cut render cascades, memory
churn, and UI jank on large sessions and big session trees. Behavior is preserved;
the changes are about *when* and *how much* the UI re-renders.
## Chat streaming
- Freeze the streaming message's parts in the bulk turn projection during streaming,
and re-inject live parts only in an isolated tail leaf, so a ~60/sec delta stream
no longer re-runs the whole-session projection or re-renders unrelated rows.
session with referential reuse of unchanged turns.
- Memoize message rows with field-aware comparators instead of reference equality.
- Replace the manual child-session polling in the task tool with the live SSE
stream + a one-shot load, removing a fetch/settle state machine.
## History loading & scroll
- Load an initial page fast, then prepend one older page in the background so the
scroll container has headroom and "load older on scroll-up" fires before the user
hits the absolute top.
- Compensate scroll synchronously (in a layout effect, before paint) for prepends —
including background prepends that don't originate from a user scroll — so the
viewport stays stable instead of judder-correcting on the next frame.
## Markdown rendering
- Render markdown synchronously *styled* on first paint (paragraphs, lists, code
cards, tables, inline code) instead of raw escaped text; the async pass then only
upgrades syntax-highlight colors. Eliminates the flash of full-width raw text.
- Load KaTeX CSS eagerly with the main bundle instead of inside the lazy markdown
chunk, avoiding a late stylesheet injection on first render.
## Sidebar
- Hoist per-row recursive tree walks out of row comparators into per-group
precomputed sets/keys; batch live-session lookups into a single map; add a
group-level memo boundary.
- Isolate rename drafts so per-keystroke typing doesn't repaint the row tree.
## Sync layer
- Add a staleness guard so a slow message fetch can't repopulate a session the user
navigated away from.
- Throw on fetch failure for authoritative loaders so a transient blip can't read as
an empty server response.
## Cleanup
- Remove dead code (unused hooks, params, duplicated inline types) surfaced while
reworking the above.
## Known issue
- A rare, purely cosmetic first-paint width flash can still appear on large sessions;
it has no behavioral or data impact and is tracked for a follow-up runtime trace.
80 lines
2.6 KiB
TypeScript
80 lines
2.6 KiB
TypeScript
import type { Part } from '@opencode-ai/sdk/v2';
|
|
|
|
import { filterSyntheticParts } from '@/lib/messages/synthetic';
|
|
import { normalizeParts } from '../message/partUtils';
|
|
import type { ChatMessageEntry } from './turns/types';
|
|
|
|
export const hasCompactionPart = (message: ChatMessageEntry): boolean => {
|
|
return message.parts.some((part) => {
|
|
const type = (part as { type?: unknown } | null | undefined)?.type;
|
|
return type === 'compaction';
|
|
});
|
|
};
|
|
|
|
const normalizeCompactionCommandMessage = (message: ChatMessageEntry): ChatMessageEntry => {
|
|
if (!hasCompactionPart(message)) {
|
|
return message;
|
|
}
|
|
|
|
let changedParts = false;
|
|
const nextParts = message.parts.map((part) => {
|
|
const type = (part as { type?: unknown } | null | undefined)?.type;
|
|
if (type !== 'compaction') {
|
|
return part;
|
|
}
|
|
changedParts = true;
|
|
return { type: 'text', text: '/compact' } as Part;
|
|
});
|
|
|
|
const info = message.info as unknown as { clientRole?: string | null | undefined };
|
|
const needsClientRole = info.clientRole !== 'user';
|
|
|
|
if (!changedParts && !needsClientRole) {
|
|
return message;
|
|
}
|
|
|
|
return {
|
|
...message,
|
|
info: needsClientRole
|
|
? ({
|
|
...(message.info as unknown as Record<string, unknown>),
|
|
clientRole: 'user',
|
|
} as unknown as typeof message.info)
|
|
: message.info,
|
|
parts: changedParts ? nextParts : message.parts,
|
|
};
|
|
};
|
|
|
|
const normalizeMessageParts = (message: ChatMessageEntry): ChatMessageEntry => {
|
|
const parts = normalizeParts(message.parts);
|
|
if (parts.length === message.parts.length) {
|
|
return message;
|
|
}
|
|
return {
|
|
...message,
|
|
parts,
|
|
};
|
|
};
|
|
|
|
const normalizedMessageBySource = new WeakMap<ChatMessageEntry, ChatMessageEntry>();
|
|
|
|
export const getNormalizedMessageForDisplay = (message: ChatMessageEntry): ChatMessageEntry => {
|
|
const cached = normalizedMessageBySource.get(message);
|
|
if (cached) {
|
|
return cached;
|
|
}
|
|
|
|
const normalizedPartMessage = normalizeMessageParts(message);
|
|
const normalizedCompactionMessage = normalizeCompactionCommandMessage(normalizedPartMessage);
|
|
const filteredParts = filterSyntheticParts(normalizedCompactionMessage.parts);
|
|
const normalized = filteredParts === normalizedCompactionMessage.parts
|
|
? normalizedCompactionMessage
|
|
: {
|
|
...normalizedCompactionMessage,
|
|
parts: filteredParts,
|
|
};
|
|
|
|
normalizedMessageBySource.set(message, normalized);
|
|
return normalized;
|
|
};
|