Skip to content

⚡ Bolt: [performance improvement] In-memory subset derivation to prevent redundant API queries #203

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
aicoder2009 wants to merge 1 commit into
base: main
Choose a base branch
from
Open

⚡ Bolt: [performance improvement] In-memory subset derivation to prevent redundant API queries #203

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions .jules/bolt.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,3 +5,7 @@
## 2024-05-18 - Concurrent Fetching with Owner IDs in Share Links
**Learning:** In the share system, endpoints processing a share code typically suffer from waterfall latency by first loading target entity details (like a project) and then querying its associated elements (like project lists) using the entity's owner ID (`userId`). However, the `shareLink` object already contains the `userId` field (representing the owner's ID).
**Action:** Always leverage the existing owner's ID within `shareLink` to bypass sequential dependencies and fetch parent entities (like projects) concurrently with their child elements (like user lists) using `Promise.all`.

## 2024-05-19 - [In-Memory Subset Derivation]
**Learning:** Making separate API requests for a global collection (like all lists) and a subset of that collection (like project lists) within the same page creates redundant backend database queries.
**Action:** When fetching a global collection and a subset of that collection simultaneously on the frontend, derive the subset in-memory using array filtering instead of making a redundant API request to avoid duplicate backend database queries.
18 changes: 9 additions & 9 deletions src/app/projects/[id]/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,17 +58,17 @@ export default function ProjectDetailPage({ params }: { params: Promise<{ id: st
setIsLoading(true);

// OPTIMIZATION: Execute independent network requests and JSON parsing concurrently
// using Promise.all. This prevents a 3-step waterfall, reducing Time to First Byte
// using Promise.all. This prevents a waterfall, reducing Time to First Byte
// (TTFB) and overall load time significantly on this detail page.
const [projectRes, listsRes, allListsRes] = await Promise.all([
// Further optimized by deriving project lists from allLists in-memory rather than
// making a redundant API request to /api/projects/[id]/lists.
const [projectRes, allListsRes] = await Promise.all([
fetch(`/api/projects/${projectId}`),
fetch(`/api/projects/${projectId}/lists`),
fetch("/api/lists"),
]);

const [projectResult, listsResult, allListsResult] = await Promise.all([
const [projectResult, allListsResult] = await Promise.all([
projectRes.json(),
listsRes.json(),
allListsRes.json(),
]);

Expand All @@ -81,12 +81,12 @@ export default function ProjectDetailPage({ params }: { params: Promise<{ id: st
setEditName(projectResult.data.name);
setEditDescription(projectResult.data.description || "");

if (listsResult.success) {
setLists(listsResult.data);
}

if (allListsResult.success) {
setAllLists(allListsResult.data);

// Derive subset in-memory to prevent duplicate backend queries
const projectLists = (allListsResult.data as List[]).filter((l) => l.projectId === projectId);
setLists(projectLists);
}
Comment on lines 84 to 90
Comment on lines 84 to 90

@coderabbitai coderabbitai Bot Jul 1, 2026

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Silent no-op if the /api/lists fetch fails.

Since lists is now derived exclusively from allListsResult, a failed/unsuccessful /api/lists response leaves both allLists and lists unset with no error surfaced to the user — the project page will silently render "0 lists" instead of indicating a load failure.

💡 Suggested fix 
       if (allListsResult.success) {
         setAllLists(allListsResult.data);

         // Derive subset in-memory to prevent duplicate backend queries
         const projectLists = (allListsResult.data as List[]).filter((l) => l.projectId === projectId);
         setLists(projectLists);
+      } else {
+        setError(allListsResult.error || "Failed to load lists");
       }
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
if (allListsResult.success) {
setAllLists(allListsResult.data);
// Derive subset in-memory to prevent duplicate backend queries
const projectLists = (allListsResult.data as List[]).filter((l) => l.projectId === projectId);
setLists(projectLists);
}
if (allListsResult.success) {
setAllLists(allListsResult.data);
// Derive subset in-memory to prevent duplicate backend queries
const projectLists = (allListsResult.data as List[]).filter((l) => l.projectId === projectId);
setLists(projectLists);
} else {
setError(allListsResult.error || "Failed to load lists");
}
🤖 Prompt for AI Agents 
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@src/app/projects/`[id]/page.tsx around lines 84 - 90, The project page in the
`[id]/page.tsx` flow silently does nothing when the `/api/lists` fetch fails
because `allListsResult` is the only source for both `allLists` and `lists`.
Update the data-loading logic around the `allListsResult` handling to surface an
error state when the fetch is unsuccessful, and make sure the UI renders a
failure/empty-state message instead of defaulting to “0 lists.” Use the existing
page state and fetch path in `ProjectPage` to set an error flag/message
alongside `setAllLists` and `setLists`.

} catch (err) {
console.error("Error fetching project:", err);
Expand Down
Loading