설계 원칙

critical-script는 메인 JS 번들보다 먼저 실행되어야 하는 작업을 최소한의 코드로 수행하기 위한 도구입니다.

• 메인 JS 번들이 로드되기 전에 실행되어야 효과가 있는 작업만 포함하세요. 예를 들어 API 프리페치나 리소스 프리로드, 웹뷰 네이티브 브릿지 호출 등이 있습니다.
• 동기 연산이나 대규모 라이브러리를 사용하는 등 실행 비용이 큰 로직은 일반 JS 번들에 포함하세요.
• 기본값인 outputSizeLimit 8192바이트를 통해 이 원칙을 빌드 단계에서 강제할 수 있습니다. 자세한 내용은 API 레퍼런스 > outputSizeLimit를 참고하세요.

언제 사용하나요

critical-script는 다음 두 조건을 모두 만족하는 작업에 적합합니다.

1. 실행 시점이 중요한 작업: 메인 JS 번들이 로드되기 전에 실행되어야 효과가 있는 작업입니다. 예를 들어 API 프리페치, 리소스 프리로드, 웹뷰 네이티브 브릿지 호출, 스켈레톤 UI 보정 등이 있습니다.
2. 일정 수준 이상의 로직이 필요한 작업: 인라인으로 직접 작성하기에는 로직이 복잡하고, 자주 수정하거나 재사용해야 하는 경우 TypeScript의 정적 검사, 모듈 시스템, IDE 지원을 활용할 수 있습니다.

다음과 같은 경우에는 critical-script를 사용할 필요가 없습니다.

• 메인 JS 번들이 로드된 이후에 실행해도 되는 작업은 일반 JS 번들에 포함하세요.
• 실행 비용이 큰 로직은 일반 JS 번들에 포함하세요.
• 인라인 코드가 1~2줄 수준이고 거의 수정되지 않는 작업은 <script> 태그에 직접 작성하세요.