Sofia Emelianova
브라우저는 웹페이지의 콘텐츠를 먼저 표시하고 일부는 나중에 표시합니다. Fetch Priority API를 사용하면 중요한 리소스의 초기 가져오기 우선순위를 브라우저에 알려 리소스 로드를 최적화할 수 있습니다.
다음 동영상을 통해 방법을 알아보세요.
- 성능 패널에서 로드 측정항목인 최대 콘텐츠 페인트 (LCP)를 찾습니다.
- 네트워크 패널과 성능 trace의 네트워크 트랙에서 초기 및 최종 우선순위를 확인하세요.
- 로컬 재정의를 사용하여
<img>,<link>,<script>요소의fetchpriority속성을 테스트합니다. loading및fetchpriority속성의 차이점을 알아보세요.- 리소스의 우선순위를 낮춰야 하는 경우를 알아봅니다.
LCP 이미지는 fetchpriority="high"의 이점을 명확하게 누릴 수 있습니다. 또 다른 힌트는 브라우저가 자동으로 이미지의 우선순위를 높이는 경우이므로 처음에 이미지를 설정하는 것이 합리적입니다.
자세한 내용은 다음을 참고하세요.