From e1256b9d9db1e71ce846df3cdf7f39021230dbf1 Mon Sep 17 00:00:00 2001
From: seonghobae <8172694+seonghobae@users.noreply.github.com>
Date: Tue, 25 Aug 2026 21:41:28 +0000
Subject: [PATCH] =?UTF-8?q?=E2=9A=A1=20Bolt:=20[=EC=84=B1=EB=8A=A5=20?=
 =?UTF-8?q?=EA=B0=9C=EC=84=A0]=20ERD=20=EB=85=B8=EB=93=9C=20=EA=B2=80?=
 =?UTF-8?q?=EC=83=89=20=EC=8B=9C=20=EB=AC=B8=EC=9E=90=EC=97=B4=20=EB=B3=91?=
 =?UTF-8?q?=ED=95=A9=20=EB=B0=8F=20WeakMap=20=EC=BA=90=EC=8B=B1=EC=9D=84?=
 =?UTF-8?q?=20=ED=86=B5=ED=95=9C=20=EC=B5=9C=EC=A0=81=ED=99=94?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

💡 What: ERD 검색 시 노드의 모든 문자열 필드를 하나로 합쳐 `WeakMap`에 캐싱하도록 검색 로직을 수정했습니다.
🎯 Why: 기존 방식은 타이핑 시마다 노드의 모든 컬럼 문자열을 매번 `.toLocaleLowerCase()`로 변환하여 과도한 객체 할당과 GC 부하를 유발했습니다.
📊 Impact: 타이핑 시마다 발생하는 문자열 할당을 O(C)에서 O(1)로 대폭 감소시키고, C++ 수준의 단일 문자열 `.includes()`로 검색 속도를 향상시킵니다.
🔬 Measurement: 수백 개의 테이블과 컬럼이 있는 대규모 ERD에서 타이핑 시 발생하는 프레임 드랍이 현저히 감소하고 반응성이 개선됩니다.
---
 .jules/bolt.md             |  4 ++++
 frontend/src/erd/search.ts | 30 ++++++++++++++++++------------
 2 files changed, 22 insertions(+), 12 deletions(-)

diff --git a/.jules/bolt.md b/.jules/bolt.md
index f1a8c1466..9a89d7d23 100644
--- a/.jules/bolt.md
+++ b/.jules/bolt.md
@@ -77,3 +77,7 @@ Optimized metric route processing to O(N) by creating a mapping of routes direct
 ## 2024-07-13 - [Optimize Export Dictionary FK lookups]
 **Learning:** Found O(N * C * E) performance bottleneck in ERD export dictionaries due to repeated array searching with `edges.some()` inside a nested loop over nodes and columns.
 **Action:** Replace repeated linear array scans for edges by precomputing O(1) Set lookups of foreign key column handles per node before looping.
+
+## 2024-08-25 - [Search Performance] 노드 텍스트 통합 및 WeakMap 캐싱을 통한 ERD 검색 최적화
+**Learning:** 다수의 문자열 필드를 개별적으로 `.toLocaleLowerCase()` 호출하여 검색하면, 검색어 입력마다 수많은 문자열 객체가 생성되어 GC 부하와 프레임 드랍이 발생합니다. V8의 단일 문자열 탐색이 JS 루프보다 훨씬 빠릅니다.
+**Action:** 노드의 모든 검색 대상 텍스트를 하나의 문자열로 결합한 뒤 소문자로 변환하고, 이를 안정적인 `node.data` 객체를 키로 하는 `WeakMap`에 캐싱하여 O(1) 조회로 최적화해야 합니다.
diff --git a/frontend/src/erd/search.ts b/frontend/src/erd/search.ts
index 51806947a..69c3bb053 100644
--- a/frontend/src/erd/search.ts
+++ b/frontend/src/erd/search.ts
@@ -2,21 +2,25 @@ import type { Node } from "@xyflow/react";
 
 import type { TableNodeData } from "./convert";
 
-function fieldIncludes(value: string | null | undefined, term: string): boolean {
-  return Boolean(value && value.toLocaleLowerCase().includes(term));
-}
+const nodeSearchTextCache = new WeakMap<TableNodeData, string>();
+
+function getNodeSearchText(node: Node<TableNodeData>): string {
+  let text = nodeSearchTextCache.get(node.data);
+  if (text !== undefined) return text;
 
-function nodeIncludesTerm(node: Node<TableNodeData>, term: string): boolean {
-  if (fieldIncludes(node.data.title, term)) return true;
-  if (fieldIncludes(node.data.comment, term)) return true;
+  const parts: string[] = [];
+  if (node.data.title) parts.push(node.data.title);
+  if (node.data.comment) parts.push(node.data.comment);
 
-  for (const column of node.data.columns) {
-    if (fieldIncludes(column.column_name, term)) return true;
-    if (fieldIncludes(column.data_type, term)) return true;
-    if (fieldIncludes(column.column_comment, term)) return true;
+  for (const col of node.data.columns) {
+    if (col.column_name) parts.push(col.column_name);
+    if (col.data_type) parts.push(col.data_type);
+    if (col.column_comment) parts.push(col.column_comment);
   }
 
-  return false;
+  text = parts.join(" ").toLocaleLowerCase();
+  nodeSearchTextCache.set(node.data, text);
+  return text;
 }
 
 export function tableNodeMatchesSearch(
@@ -29,7 +33,9 @@ export function tableNodeMatchesSearch(
         new Set(search.trim().toLocaleLowerCase().split(/\s+/).filter(Boolean)),
       );
   if (terms.length === 0) return false;
-  return terms.every((term) => nodeIncludesTerm(node, term));
+
+  const nodeText = getNodeSearchText(node);
+  return terms.every((term) => nodeText.includes(term));
 }
 
 export function findSearchMatchedNodeIds(