#47PerformanceMedium

서드파티 스크립트 오케스트레이터

서드파티 스크립트 오케스트레이터 (Script Orchestrator)

서드파티 스크립트(분석, 광고, 채팅 위젯 등)는 메인 스레드를 점유해 성능에 큰 영향을 줍니다. 각 스크립트의 **중요도(priority)**에 따라 로드 순서를 조율하는 ScriptOrchestrator를 구현하세요.

우선순위

네 가지 우선순위(높은 순):

  1. critical — 봇 감지, 동의 관리 등 차단 자원
  2. important — 핵심 분석, A/B 테스트
  3. normal — 일반 분석, 태그 매니저 (afterInteractive)
  4. low — 채팅 위젯, 소셜 임베드 (lazyOnload)

API

interface ScriptTask {
  id: string;
  priority: 'critical' | 'important' | 'normal' | 'low';
  load: () => void;
}

class ScriptOrchestrator {
  enqueue(task: ScriptTask): void;
  flush(): void;          // priority 순서로 load() 실행, 동일 priority는 enqueue 순서
  executed: string[];     // flush 후 실행된 id 순서
}

요구사항

  • flush()는 critical → important → normal → low 순서로 load() 호출
  • 동일 priority 내에서는 enqueue 호출 순서(안정 정렬) 유지
  • 각 task의 load() 호출 후 id를 executed 배열에 기록
  • flush() 후 큐는 비워집니다 (이후 enqueue → flush 시 새로운 작업만 실행)

학습 포인트

  • 우선순위 기반 작업 스케줄링
  • 콜백 기반 사이드 이펙트 추적
  • 큐 상태 관리 및 안정 정렬
언어: