피드로 돌아가기
Dev.toFrontend
원문 읽기
React 의존성 제거 및 모듈형 설계를 통한 Angular-native GraphQL 클라이언트 구현
I got tired of Apollo Angular bugs and built my own GraphQL client
AI 요약
Context
Apollo Angular 등 기존 클라이언트가 React 라이브러리를 래핑한 구조로 인해 발생하는 버전 불일치와 불필요한 의존성 문제 분석. 특히 Normalized Cache의 복잡한 설정과 특정 상황에서 발생하는 데이터 정합성 버그로 인한 유지보수 비용 증가 확인.
Technical Solution
- Angular HttpClient 기반의 Lightweight Core 설계를 통한 프레임워크 최적화
- 모든 기능을 선택적으로 추가하는 Opt-in Modular Architecture 채택으로 번들 사이즈 최소화
- @dumbql/core를 Framework-agnostic하게 설계하여 향후 타 프레임워크 확장성 확보
- sideEffects: false 설정을 통한 Tree-shaking 최적화로 미사용 코드 제거
- Apollo의 고질적 문제인 cache.evict 및 INVALIDATE 무시 현상을 해결한 신규 캐시 로직 구현
- schema introspection 기반의 codegen 도입을 통한 Type-safe한 쿼리 환경 구축
실천 포인트
1. 외부 라이브러리 도입 시 Peer Dependency로 인해 불필요한 프레임워크가 포함되는지 확인
2. 모든 기능을 포함한 Monolithic 클라이언트보다 기능별 분리가 가능한 Modular 구조 검토
3. 프레임워크 전용 기능을 사용하는 Wrapper보다 Core 로직을 Framework-agnostic하게 분리하는 전략 수립