프론트엔드 성능
목록 전량 조회, 대형 페이로드, 렌더링 병목의 측정과 개선
Engineering 3
Engineering · Knowledge Graph
10만 노드 지식 그래프 뷰어: 렌더링 최적화에서 '무엇을 그릴 것인가'로 옮겨 간 문제
온톨로지 그래프를 브라우저에서 탐색하려고 Three.js InstancedMesh 렌더러와 Web Worker 물리 연산을 만들었지만, 컬렉션이 커지자 병목은 무엇을 그릴지로 옮겨 갔습니다. CDP 프로파일링으로 리프 노드가 비용의 대부분임을 확인해 구조 우선 샘플링으로 CPU 점유를 25%에서 7%로 낮추고, 렌더 상한 밖의 노드는 서버 검색으로 찾아 불러오게 했습니다.
Engineering · Knowledge Graph
출처는 생산 지점에서, 원본도 같은 정책으로: RAG 출처 표시 파이프라인 재정비
답변 출처가 검색 모드에 따라 사라지거나, 검색 노드 없이도 붙거나, 원본 열람이 마스킹 정책을 우회하고, 큰 CSV 출처가 브라우저를 멈추던 문제를 차례로 추적했습니다. 출처는 백엔드 생산 지점에서 결정하고, 원본도 청크와 같은 정책을 거치며, 뷰어는 보이는 만큼만 그린다는 원칙으로 정리했습니다.
Engineering · Platform Engineering
목록 렉의 원인은 분할 방식이 아니라 페이로드였다: GET 336개 전수 측정과 하위호환 서버 페이지네이션
채팅 목록 렉의 원인이 클라이언트 분할이 아니라 응답에 실린 캔버스 JSON 1.6MB였음을 실측으로 확인하고, 인자 없는 GET 336개를 전수 측정해 같은 부류를 소비처 기준으로 판정했습니다. 필드 경량화와 하위호환 서버 페이지네이션으로 고치면서 전환 과정의 필터 의미 회귀와 숨은 1,000건 상한도 함께 정리했습니다.