perf(chat): make session switching feel instant
Switching sessions ran as one synchronous commit: sidebar highlight, URL, a full timeline remount with markdown re-parse, and around nine requests, so nothing changed on screen for 150-250ms after the click. - ChatContainer swaps the timeline on a deferred copy of the selection, so the active row, URL, and tab commit first and the timeline renders behind them; selection policy keeps reading the live store value. - The message fetch starts before the selection is published. - Sidebar rows stop re-rendering on a project switch: directory-scoped sync hooks read the runtime context and a subscribable current-directory source instead of the directory-bearing context; the grouping builder reads git branches through a ref and section caches key the branches they use; descendant ids are keyed by content. Rows per switch went from 73 to 8. - Markdown skips the async re-render when the settled cached blocks are already painted, and mounts synchronously once its lazy module is loaded; the module is preloaded at boot. - A timeline reveal gate holds a freshly opened session at opacity 0 while any provisional markdown paint catches up (250ms cap), then fades the whole timeline in once, so text, tools, and recap appear together. - Switch fan-out trimmed: knowledge summary deduped, MCP status refreshed only when stale, non-repo directories cached by the git repo check, OpenChamber defaults cached briefly, agent memory reused for the same project, goal text cached, PWA manifest rebuilt after the switch settles. - Header tabs snap into the active state and keep the title at the same height in both states. - Prefetch on row press; composer focus moved off the commit. `bun run profile:switch` records ack/content latency, longest task, and requests per switch, cold and warm, and compares runs against a baseline. Measured warm switch: ack 228ms to about 40-60ms, content 228ms to about 100-120ms.
This commit is contained in:
@@ -13,6 +13,8 @@ type Props = {
|
||||
directory: string | null;
|
||||
};
|
||||
|
||||
const MCP_STATUS_MAX_AGE_MS = 60_000;
|
||||
|
||||
/**
|
||||
* MCP servers with their connection switches, reusing the dropdown's own
|
||||
* connect/disconnect actions.
|
||||
@@ -23,17 +25,19 @@ export const WorkStatusMcpSection: React.FC<Props> = ({ directory }) => {
|
||||
const mcpStatus = useMcpStore(
|
||||
React.useCallback((state) => state.getStatusForDirectory(directory), [directory]),
|
||||
);
|
||||
const refreshMcp = useMcpStore((state) => state.refresh);
|
||||
const ensureMcpFresh = useMcpStore((state) => state.ensureFresh);
|
||||
const connect = useMcpStore((state) => state.connect);
|
||||
const disconnect = useMcpStore((state) => state.disconnect);
|
||||
const [busyServer, setBusyServer] = React.useState<string | null>(null);
|
||||
|
||||
// The panel must not depend on the header dropdown having been mounted or
|
||||
// opened to know its MCP servers. Silent and background-gated, so it cannot
|
||||
// compete with chat bootstrap traffic for sockets.
|
||||
// compete with chat bootstrap traffic for sockets. The section remounts on
|
||||
// every session switch, so it only asks for a status that is missing or
|
||||
// older than a minute; connect/disconnect/auth refresh on their own.
|
||||
React.useEffect(() => {
|
||||
void runBackgroundNetworkTask(() => refreshMcp({ directory, silent: true }));
|
||||
}, [directory, refreshMcp]);
|
||||
void runBackgroundNetworkTask(() => ensureMcpFresh({ directory, silent: true, maxAgeMs: MCP_STATUS_MAX_AGE_MS }));
|
||||
}, [directory, ensureMcpFresh]);
|
||||
|
||||
const mcpServers = React.useMemo(
|
||||
() => Object.entries(mcpStatus ?? {}).sort(([left], [right]) => left.localeCompare(right)),
|
||||
|
||||
Reference in New Issue
Block a user