차세대 이미지 포맷(AVIF·WebP)과 엣지 캐싱 전략
고화질 미디어를 최소 용량으로 전송하기 위한 AVIF 코덱 특성과 브라우저 호환성 협상(Content Negotiation), 엣지 변환 파이프라인의 실무적 구성을 다룹니다.
웹 페이지 로딩 무게의 상당 부분은 여전히 이미지 에셋이 차지합니다. LCP(Largest Contentful Paint) 지표를 개선하기 위해서는 이미지 압축과 엣지 캐시 전략이 중요한 역할을 합니다.
1. AVIF vs WebP vs JPEG 압축 효율
- AVIF (AV1 Image File Format): 영상 코덱 AV1 기술을 응용하여 기존 JPEG 대비 유의미하게 작은 용량으로 시각 품질을 유지합니다.
- WebP: 대다수 최신 브라우저에서 안정적으로 지원되며 무손실 압축 및 알파 채널을 제공합니다.
2. Accept 헤더 기반 엣지 콘텐츠 협상
단일 미디어 URL에 대해 엣지 CDN이 클라이언트의 Accept 헤더를 검사하여 최적 포맷을 전달하는 구성을 채택하면 마크업 복잡도를 줄일 수 있습니다.