피드로 돌아가기
Add drawing tools, indicators and replay to Lightweight Charts without stitching six repos together
Dev.toDev.to
Frontend

Lightweight Charts 기반 통합 API 레이어 CandleKit을 통한 트레이딩 UI 구축 복잡도 제거

Add drawing tools, indicators and replay to Lightweight Charts without stitching six repos together

Rohan Deogaonkar2026년 6월 10일4intermediate

Context

Lightweight Charts의 빠른 렌더링 성능에도 불구하고 Drawing Tools, Indicators, Replay 등 필수 트레이딩 기능의 부재로 인한 파편화된 외부 라이브러리 의존성 발생. 다수의 커뮤니티 레포지토리를 결합하는 과정에서 API 스타일 불일치 및 중복 구현으로 인한 개발 리소스 낭비 심화.

Technical Solution

  • Lightweight Charts의 Canvas Primitives를 직접 활용한 자체 Drawing Engine 구현으로 외부 런타임 의존성 제거
  • IndicatorRegistry를 통한 확장 가능한 플러그인 아키텍처 설계로 사용자 정의 지표 등록 인터페이스 제공
  • Deterministic Replay Controller 구현을 통한 바(Bar) 단위 훅 제공 및 백테스팅을 위한 결정론적 상태 제어
  • Framework-agnostic Core 설계 및 Optional React Wrapper 제공을 통한 런타임 유연성 확보
  • ChartPlugin 시스템 도입으로 Drawing, Indicators, Measurement 기능을 교체 가능한 모듈 구조로 설계
  • Tree-shakeable API 구조 채택을 통해 필요한 기능만 번들에 포함시키는 최적화 수행

1. 라이브러리 조합 시 발생하는 API 불일치 해결을 위해 통합 인터페이스 레이어 검토

2. 기능 확장성을 위해 하드코딩 대신 Registry 패턴을 통한 플러그인 시스템 도입 고려

3. 프레임워크 종속성을 최소화한 Core 로직 설계 후 얇은 어댑터 층으로 UI 프레임워크 연결

원문 읽기