패턴
이 섹션은 Context-Action 프레임워크를 위한 포괄적인 코드 패턴과 구현 가이드를 포함하고 있습니다.
핵심 프레임워크 패턴
액션 패턴
스토어 패턴
- 스토어 패턴 - 타입 안전 스토어 관리 (권장)
Ref 패턴
- Ref 패턴 - 제로 리렌더링과 컨텍스트 싱글톤 관리를 통한 직접 DOM 조작
- 기본 사용법 - 타입 안전 ref 관리를 활용한 기본적인 RefContext 패턴
- 컨텍스트 싱글톤 처리 - 지연 평가를 통한 컨텍스트 싱글톤 및 외부 리소스 관리
- 다중 컨텍스트 - 복잡한 애플리케이션을 위한 다중 RefContext 구성
- 성능 - 하드웨어 가속 및 성능 최적화
아키텍처 패턴
- 아키텍처 패턴 - 시스템 아키텍처 및 디자인 패턴
- MVVM 패턴 - 완벽한 레이어 분리를 갖춘 Model-View-ViewModel 아키텍처
- 도메인 컨텍스트 패턴 - 다중 도메인 앱을 위한 문서 중심 도메인 분리
- 구성 전략 - 복잡한 애플리케이션을 위한 고급 패턴 구성
- 컨텍스트 분할 패턴 - 확장성을 위한 대형 컨텍스트 관리 및 분할
비동기 패턴
- 비동기 패턴 - 비동기 작업 패턴 및 제어 흐름
- 실시간 상태 액세스 - store.getValue()를 통한 클로저 트랩 방지
- Wait-Then-Execute - 요소 가용성 이후 안전한 DOM 작업
- 조건부 대기 - 조건 기반 스마트 대기
- 타임아웃 보호 - 폴백 전략을 통한 무한 대기 방지
성능 패턴
디버그 패턴
빠른 시작 가이드
| 패턴 | 사용 사례 | 임포트 | 최적 용도 |
|---|---|---|---|
| 🎯 Action Only | 스토어 없는 액션 디스패칭 | createActionContext | 이벤트 시스템, 명령 패턴 |
| 🏪 Store Only | 액션 없는 상태 관리 | createStoreContext | 순수 상태 관리, 데이터 레이어 |
| 🔧 Ref Context (고급) | 직접 DOM 조작 및 싱글톤 객체 관리 | createRefContext | 고성능 UI, 애니메이션, 외부 서비스 |
참고: 복잡한 애플리케이션의 경우 최대 유연성과 관심사 분리를 위해 패턴들을 조합하여 사용하세요.
사용 가이드라인
각 패턴은 다음을 포함합니다:
- ✅ 모범 사례 작업 예제
- ❌ 피해야 할 일반적인 함정
- 🎯 사용 사례 패턴 적용 시기
- ⚡ 성능 고려사항 및 최적화 팁
아키텍처 의사결정 가이드
단일 도메인 애플리케이션
- 간단한 앱: Store Only Pattern으로 시작
- 인터랙티브 앱: 비즈니스 로직을 위해 Action Only Pattern 추가
- 고성능 앱: 애니메이션을 위해 RefContext Pattern (고급) 추가
- 복잡한 앱: 완벽한 레이어 분리를 위해 MVVM Architecture 사용
다중 도메인 애플리케이션
- 팀 경계: 비즈니스 분리를 위해 Domain Context Architecture 사용
- 결합된 접근: 각 비즈니스 도메인 내에서 MVVM Architecture 적용
- 엔터프라이즈 규모: 적절한 도메인 격리와 함께 핵심 및 고급 패턴 결합
패턴 통합
이러한 패턴들은 복잡한 시나리오를 위해 결합될 수 있습니다:
- Action Only + Store Only 완전한 비즈니스 로직 분리용
- RefContext + Store Only 고성능 상태 기반 애니메이션용
- 핵심 + 고급 패턴 + Domain Architecture 엔터프라이즈 애플리케이션용
- MVVM Architecture 완벽한 아키텍처 레이어 분리용