JPG를 AVIF로 대체하기 위한 기술 평가 가이드: 압축률부터 프로덕션 파이프라인까지

1992년에 발표된 JPEG 표준은 블록 기반 이산 코사인 변환(DCT) 인코딩을 사용하며, 8x8 픽셀 블록에 대해 독립적인 변환 인코딩을 수행합니다. 블록 기반 압축은 쉽게 블로킹 아티팩트가 발생하며 8비트 색 심도만 지원합니다.

2018년에 발표된 AV1 인트라 코딩은 다방향 예측, 재귀 분할, 인루프 필터링 등의 기술을 사용합니다. 이미지의 지역 텍스처에 따라 인코딩 블록 크기를 조정할 수 있고 블로킹 효과를 제거하며, 압축 모델이 현대 이미지의 콘텐츠 특성에 더 잘 적응합니다.

Google의 공개 테스트 데이터에 따르면 동일한 SSIM 이미지 품질에서 AVIF 파일 크기는 JPG보다 30%에서 50% 더 작습니다. 국내 CDN 사업자의 테스트 데이터에서도 웹 이미지 시나리오에서 이 범위가 기본적으로 일치하는 것으로 나타났습니다.

JPG는 8비트 SDR 색상만 지원하며 최대 256 계조 표시가 가능합니다. AVIF는 기본적으로 10비트 및 12비트 색 심도를 지원하며 BT.2020 색 영역을 커버할 수 있고 HDR 표시 장치에 적응합니다.

동일 이미지 품질에서 단일 AVIF 이미지의 인코딩 시간은 JPG의 약 10배에서 20배입니다. AOM 공식 레퍼런스 인코더인 libaom의 단일 스레드 인코딩 속도는 libjpeg-turbo보다 훨씬 낮습니다.

기존 프로덕션 파이프라인에서는 오프라인 사전 인코딩, 분산 인코딩 클러스터, 또는 SVT-AV1과 같은 속도 최적화된 인코더를 사용해 인코딩 시간의 영향을 줄일 수 있습니다. 당분간 실시간 온라인 인코딩 시나리오에서는 대체를 권장하지 않습니다.

파이프라인 구축은 새로운 AVIF 인코딩 출력 브랜치를 추가하는 것만으로 충분하며, 원래 JPG 출력 링크를 삭제할 필요가 없습니다. 폴백 솔루션을 통해 원활한 전환을 구현할 수 있습니다.

2024년 2분기 기준 글로벌 데스크톱의 Chrome, Firefox, Edge, Safari 16 이상은 모두 기본적으로 AVIF 형식을 지원하며 커버리지 비율은 92% 이상입니다. 모바일의 경우 Android 브라우저의 커버리지 비율은 90%를 초과합니다.

HTML picture 태그를 사용해 폴백 호환성을 구현할 수 있습니다: AVIF를 먼저 로드하고, AVIF를 지원하지 않는 브라우저는 자동으로 JPG 형식으로 폴백됩니다. 이는 프론트엔드 img 태그 구조만 조정하면 구현됩니다.