Description
In tool-fallback.tsx, JSON.stringify(status.error) and JSON.stringify(result, null, 2) run during render. For large tool results, this creates significant CPU overhead on every re-render.
File to change
surfsense_web/components/assistant-ui/tool-fallback.tsx (lines 22-33, 124-126)
Current code
const cancelledReason = isCancelled && status.error
? typeof status.error === "string" ? status.error : JSON.stringify(status.error)
: null;
<pre>{typeof result === "string" ? result : JSON.stringify(result, null, 2)}</pre>What to do
Wrap the serialized strings in useMemo:
const serializedError = useMemo(
() => (status?.error && typeof status.error !== "string" ? JSON.stringify(status.error) : null),
[status?.error]
);
const serializedResult = useMemo(
() => (result !== undefined && typeof result !== "string" ? JSON.stringify(result, null, 2) : null),
[result]
);
Acceptance criteria
JSON.stringify is memoized and only recomputes when source data changes- Tool results and errors still display correctly
Description
In
tool-fallback.tsx,JSON.stringify(status.error)andJSON.stringify(result, null, 2)run during render. For large tool results, this creates significant CPU overhead on every re-render.File to change
surfsense_web/components/assistant-ui/tool-fallback.tsx(lines 22-33, 124-126)Current code
What to do
Wrap the serialized strings in
useMemo:Acceptance criteria
JSON.stringifyis memoized and only recomputes when source data changes