프로젝트 목록으로

사내 디지털 트윈 웹 서비스

PCB 설계 협업 툴 · 삼성전자 네트워크사업부 연계

2025.08 ~ 2025.11 (초기 6주 + 6주 연장)팀장 · FE Architect기여도 40% · FE 코어 로직·아키텍처
JavaScript (VanillaJS)Konva.js

주요 성과

01

2,000개 부품 드래그 선택 780ms12ms

02

4~5개 파일 수정 흐름 → Store 1곳 중심 상태관리

03

400여 명 VoC 기반 연간 1,600시간 절감

핵심 기여

문제

2,000개 이상의 부품 Node가 렌더링되는 Canvas에서 드래그 선택 시 전체 객체 순회로 780ms 수준의 지연이 발생했습니다.

내가 한 일

  • Quad-Tree와 Dynamic BVH를 검토한 뒤 도메인 특성에 맞지 않는 재구성 비용을 제외
  • 기판을 10mm × 10mm 고정 격자로 나누고 드래그 범위와 가까운 셀만 탐색

결과

드래그 선택 지연을 780ms에서 12ms로 줄여 대량 부품 환경에서도 즉각적인 상호작용이 가능하게 만들었습니다.

유명한 자료구조보다 현재 도메인의 제약에 맞는 단순한 구조가 더 좋은 성능과 유지보수성을 줄 수 있습니다.

프로젝트 개요

400여 명 실무 VoC를 기반으로 PCB 설계 업무의 중복 입력과 데이터 단절을 재정의했습니다. 2,000개 부품 드래그 선택 성능은 780ms에서 12ms로 개선했고, SSoT + Pub-Sub 구조로 복잡한 화면 상태를 정리해 연간 1,600시간 업무 효율화 흐름을 만들었습니다.

배운 점

좋은 명세는 그대로 구현하는 문서가 아니라 현업의 반복 비용을 줄이는 방향으로 재정의되어야 합니다.

프론트엔드 성능 개선은 감이 아니라 측정, 병목 규명, 구조 변경, 재측정의 순서로 진행해야 합니다.