refactor(frontend): optimize network queries and improve code readability#919
refactor(frontend): optimize network queries and improve code readability#919zhiyunyao wants to merge 2 commits intobytedance:mainfrom
Conversation
There was a problem hiding this comment.
Pull request overview
This PR focuses on improving frontend responsiveness by reducing unnecessary network fetching in thread/model hooks and simplifying thread title handling in the chat UI, aligning with the performance concerns raised in #909 and partially addressing perceived latency from #887.
Changes:
- Limit streamed thread state history fetching and reduce query refetches on window focus.
- Add field selection to the threads search query to reduce response payload.
- Simplify thread title derivation and related page title logic; refactor
loadModelsfetch flow.
Reviewed changes
Copilot reviewed 5 out of 5 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| frontend/src/core/threads/utils.ts | Simplifies titleOfThread with nullish coalescing. |
| frontend/src/core/threads/hooks.ts | Adjusts stream history fetching; optimizes threads search query and disables refetch-on-focus. |
| frontend/src/core/models/hooks.ts | Disables refetch-on-focus for the models query. |
| frontend/src/core/models/api.ts | Cleans up loadModels async flow (single await) but changes typing approach. |
| frontend/src/app/workspace/chats/[thread_id]/page.tsx | Refactors title/message selection logic and document title handling. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
zhiyunyao
force-pushed
the
refactor/frontend
branch
from
0ac3ec0 to
11c0ffe
Compare
…lity
- useThreadStream: Add useStream with fetchStateHistory: {limit: 1}
- useThreads: Add select fields and disable refetchOnWindowFocus
- useModels: Disable refetchOnWindowFocus
- ChatPage and titleOfThread: Improve thread title logic
- loadModels: Refactor code for better readability
zhiyunyao
force-pushed
the
refactor/frontend
branch
from
11c0ffe to
4a99516
Compare
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 5 out of 5 changed files in this pull request and generated 3 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| return thread.values.title; | ||
| } | ||
| return "Untitled"; | ||
| return thread?.values?.title ?? "Untitled"; |
There was a problem hiding this comment.
titleOfThread takes a non-optional AgentThread, but the implementation uses thread?.…. This optional chaining can mask programming errors (passing undefined) and makes the contract unclear. Either remove the thread? and rely on values?.title, or widen the parameter type to explicitly accept null | undefined if that’s intended.
| return thread?.values?.title ?? "Untitled"; | |
| return thread.values?.title ?? "Untitled"; |
| threadId: isNewThread ? undefined : threadId, | ||
| reconnectOnMount: true, | ||
| fetchStateHistory: true, | ||
| fetchStateHistory: {limit: 1}, |
There was a problem hiding this comment.
Formatting: fetchStateHistory: {limit: 1} is inconsistent with the surrounding code style (spaces inside braces, and after :). Please run the formatter or update it to match the file’s existing formatting.
| fetchStateHistory: {limit: 1}, | |
| fetchStateHistory: { limit: 1 }, |
| select: [ | ||
| "thread_id", "updated_at", "values" | ||
| ], |
There was a problem hiding this comment.
Formatting: the select array is split across multiple lines but keeps all elements on one line, which doesn’t match the formatting used elsewhere in this file (e.g., streamMode: ["values", ...]). Please reformat (either a single-line array or one element per line) to keep consistent style and avoid noisy diffs.
| select: [ | |
| "thread_id", "updated_at", "values" | |
| ], | |
| select: ["thread_id", "updated_at", "values"], |
PR Summary
This pull request aims to improve frontend performance, as outlined in #909 and #887 (note: fully resolving #887 requires backend efforts, which are outside the scope of this PR). The main improvements focus on optimizing network queries to reduce unnecessary data fetching.
1. Optimize Network Queries
useThreadStream: AddeduseStreamwithfetchStateHistory: { limit: 1 }to limit the amount of fetched data.useThreads: Addedselectfields to minimize redundant network requests and disabledrefetchOnWindowFocusto prevent unnecessary re-fetching when the window regains focus.useModels: DisabledrefetchOnWindowFocusto avoid unnecessary re-fetching when the window regains focus.2. Improve Code Readability
ChatPageandtitleOfThread: Refined thread title logic for improved clarity and maintainability.loadModels: Refactored code for better readability and structure.