⚡ Bolt: [네트워크 그래프 관계 및 노드 선택 O(1) 맵 최적화] - #1325
Conversation
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
📝 WalkthroughWalkthroughThe PR adds a ChangesNetworkGraph changes
Estimated code review effort: 3 (Moderate) | ~20 minutes Possibly related PRs
🚥 Pre-merge checks | ✅ 4✅ Passed checks (4 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with 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.
Inline comments:
In `@frontend/src/components/NetworkGraph.tsx`:
- Around line 174-190: Update the nodeObjectMap construction in NetworkGraph to
preserve the first node for each normalized string ID by inserting only when the
map does not already contain the key. Apply the same first-entry behavior as
edgeObjectMap or nodeMap so duplicate and string-equivalent IDs cannot overwrite
earlier selections.
In `@plan.md`:
- Around line 119-139: Update the validation and pre-commit sections of plan.md
to record each required command exactly—lint, typecheck, build, test, and
test:e2e from the frontend directory—along with its actual result. Add relevant
academic citations with links and brief summaries supporting the performance
optimization, and commit paper PDFs only when redistribution is permitted;
ensure the PR description reflects the completed evidence and citations.
🪄 Autofix
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro Plus
Run ID: 2354dea6-522c-4509-88bc-e9fedcbf1979
📒 Files selected for processing (5)
.jules/bolt.mdfrontend/src/components/NetworkGraph.tsxfrontend/src/components/NetworkGraph.tsx.origget_plan.pyplan.md
| const edgeObjectMap = useMemo(() => { | ||
| const map = new Map<string, Edge>(); | ||
| for (const edge of edges) { | ||
| if (edge.id != null) { | ||
| map.set(String(edge.id), edge); | ||
| } | ||
| } | ||
| return map; | ||
| }, [edges]); | ||
|
|
||
| const nodeObjectMap = useMemo(() => { | ||
| const map = new Map<string, Node>(); | ||
| for (const node of nodes) { | ||
| map.set(String(node.id), node); | ||
| } | ||
| return map; | ||
| }, [nodes]); |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
Preserve first-match selection for colliding IDs.
The previous edges.find() and nodes.find() calls returned the first string-equivalent ID. These maps overwrite earlier entries. A 1 and "1", or duplicate backend IDs, now select the last object. nodeMap keeps the first label while nodeObjectMap selects the last node, so the label and selected node can disagree.
Keep the first map entry, or reject duplicate normalized IDs during normalization.
Proposed fix
for (const edge of edges) {
if (edge.id != null) {
- map.set(String(edge.id), edge);
+ const key = String(edge.id);
+ if (!map.has(key)) {
+ map.set(key, edge);
+ }
}
}Apply the same map.has(key) guard to nodeObjectMap.
📝 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.
| const edgeObjectMap = useMemo(() => { | |
| const map = new Map<string, Edge>(); | |
| for (const edge of edges) { | |
| if (edge.id != null) { | |
| map.set(String(edge.id), edge); | |
| } | |
| } | |
| return map; | |
| }, [edges]); | |
| const nodeObjectMap = useMemo(() => { | |
| const map = new Map<string, Node>(); | |
| for (const node of nodes) { | |
| map.set(String(node.id), node); | |
| } | |
| return map; | |
| }, [nodes]); | |
| const edgeObjectMap = useMemo(() => { | |
| const map = new Map<string, Edge>(); | |
| for (const edge of edges) { | |
| if (edge.id != null) { | |
| const key = String(edge.id); | |
| if (!map.has(key)) { | |
| map.set(key, edge); | |
| } | |
| } | |
| } | |
| return map; | |
| }, [edges]); | |
| const nodeObjectMap = useMemo(() => { | |
| const map = new Map<string, Node>(); | |
| for (const node of nodes) { | |
| const key = String(node.id); | |
| if (!map.has(key)) { | |
| map.set(key, node); | |
| } | |
| } | |
| return map; | |
| }, [nodes]); |
🤖 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 `@frontend/src/components/NetworkGraph.tsx` around lines 174 - 190, Update the
nodeObjectMap construction in NetworkGraph to preserve the first node for each
normalized string ID by inserting only when the map does not already contain the
key. Apply the same first-entry behavior as edgeObjectMap or nodeMap so
duplicate and string-equivalent IDs cannot overwrite earlier selections.
| 2. Format the code by running `run_in_bash_session` with `cd frontend && pnpm run lint --fix`. | ||
| 3. Use the `read_file` tool on `frontend/src/components/NetworkGraph.tsx` to confirm changes. | ||
| 4. Test by running `run_in_bash_session` with `cd frontend && pnpm run test && pnpm run build && pnpm run test:e2e`. | ||
| 5. Complete pre-commit steps to ensure proper testing, verification, review, and reflection are done. | ||
| 6. Submit PR using the `submit` tool with exactly: | ||
| - branch_name: "perf-optimize-network-graph-lookups" | ||
| - commit_message: "⚡ Bolt: 네트워크 그래프 O(N) 탐색을 O(1) 맵 탐색으로 최적화" | ||
| - title: "⚡ Bolt: [네트워크 그래프 관계 및 노드 선택 O(1) 맵 최적화]" | ||
| - description: """ | ||
| 💡 What | ||
| - `NetworkGraph.tsx`에서 노드/관계 선택 및 레이블 렌더링 시 발생하는 `edges.find()`와 `nodes.find()`(`O(N)`)를 `useMemo`로 사전 계산된 `Map.get()`(`O(1)`)으로 대체했습니다. | ||
|
|
||
| 🎯 Why | ||
| - 복잡한 네트워크 그래프를 렌더링하고 유저 인터랙션 시, 노드나 관계의 개수가 많아질 경우 매번 배열 전체를 순회(`O(N)`)하게 되어 불필요한 연산 오버헤드와 프레임 저하가 발생할 수 있습니다. 맵을 사용하면 이 병목을 해결할 수 있습니다. | ||
|
|
||
| 📊 Impact | ||
| - 그래프 노드 및 엣지 선택 이벤트 발생 시 탐색 복잡도를 O(N)에서 O(1)로 줄여 빠른 UI 응답성을 제공합니다. | ||
|
|
||
| 🔬 Measurement | ||
| - `pnpm test` 및 `pnpm run test:e2e` 통과 여부 확인을 통해 정상 작동을 검증했습니다. | ||
| """ |
There was a problem hiding this comment.
📐 Maintainability & Code Quality | 🟠 Major | ⚡ Quick win
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
set -euo pipefail
jq '.scripts' frontend/package.jsonRepository: ContextualWisdomLab/naruon
Length of output: 773
🏁 Script executed:
#!/bin/bash
set -euo pipefail
printf '%s\n' '--- AGENTS.md ---'
cat AGENTS.md
printf '%s\n' '--- plan.md lines 119-139 ---'
nl -ba plan.md | sed -n '119,139p'
printf '%s\n' '--- frontend/package.json scripts ---'
jq '.scripts' frontend/package.json
printf '%s\n' '--- relevant verification configuration/files ---'
git ls-files | grep -E '(^|/)(AGENTS\.md|package\.json|pnpm-lock\.yaml|vitest\.config|playwright\.config|tsconfig\.json|eslint\.config|\.eslintrc)' | head -80Repository: ContextualWisdomLab/naruon
Length of output: 49158
🏁 Script executed:
#!/bin/bash
set -euo pipefail
printf '%s\n' '--- plan.md lines 119-139 ---'
python3 - <<'PY'
from pathlib import Path
path = Path("plan.md")
lines = path.read_text().splitlines()
for number in range(119, min(139, len(lines)) + 1):
print(f"{number:4}: {lines[number - 1]}")
PY
printf '%s\n' '--- repository references and plan verification wording ---'
rg -n -i --glob '!.git/**' \
'academic|literature|citation|verification commands|pnpm run (lint|typecheck|build|test|test:e2e)|test:e2e' \
AGENTS.md plan.md README.md docs frontend/package.json 2>/dev/null | head -160Repository: ContextualWisdomLab/naruon
Length of output: 12955
Complete the PR validation evidence and literature citations.
Update plan.md so the PR body lists these exact commands and their results:
cd frontend && pnpm run lintcd frontend && pnpm run typecheckcd frontend && pnpm run buildcd frontend && pnpm run testcd frontend && pnpm run test:e2e
For this substantive performance PR, add relevant academic citations, links, and short summaries. Commit paper PDFs only when redistribution is permitted.
🤖 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 `@plan.md` around lines 119 - 139, Update the validation and pre-commit
sections of plan.md to record each required command exactly—lint, typecheck,
build, test, and test:e2e from the frontend directory—along with its actual
result. Add relevant academic citations with links and brief summaries
supporting the performance optimization, and commit paper PDFs only when
redistribution is permitted; ensure the PR description reflects the completed
evidence and citations.
Source: Coding guidelines
![github-code-quality[bot]](https://avatars.githubusercontent.com/u/9919?s=60&v=4){kind=small}
| @@ -0,0 +1,15 @@ | |||
| import sys | |||
|
PR governance metadata gate is not ready for
|
|
Superseded by #1342 after exact-diff review. #1325's only product delta is the same |
Understood. Acknowledging that this work is now obsolete and stopping work on this task. |
1 participant
💡 What
NetworkGraph.tsx에서 노드/관계 선택 및 레이블 렌더링 시 발생하는edges.find()와nodes.find()(O(N))를useMemo로 사전 계산된Map.get()(O(1))으로 대체했습니다.🎯 Why
O(N))하게 되어 불필요한 연산 오버헤드와 프레임 저하가 발생할 수 있습니다. 맵을 사용하면 이 병목을 해결할 수 있습니다.📊 Impact
🔬 Measurement
pnpm test및pnpm run test:e2e통과 여부 확인을 통해 정상 작동을 검증했습니다.PR created automatically by Jules for task 9175516969188916035 started by @seonghobae
Summary by CodeRabbit