WebP의 무손실 및 투명도 인코딩

지르키 알라쿠할라 박사 Google, Inc.
빈센트 라보 박사, Google, Inc.
최종 업데이트: 2017년 8월 1일

개요 -- 무손실 및 손실 모드에서 WebP 인코더/디코더의 리소스 사용량을 PNG의 리소스 사용량과 비교합니다. Google에서는 웹에서 무작위로 선택한 반투명 PNG 이미지 12,000개로 구성된 코퍼스와 간단한 측정치를 사용하여 성능의 변화를 표시합니다. WebP 이미지를 크기가 최적화된 PNG와 비교하기 위해 코퍼스의 PNG를 다시 압축했습니다. Google의 결과에 따르면 WebP가 크기와 처리 속도 모두에서 PNG를 웹용으로 사용하기에 적합한 대안임을 알 수 있습니다.

소개

WebP는 무손실 및 반투명 이미지를 지원하므로 PNG 형식의 대안이 됩니다. 사전 코딩, Huffman 코딩, 색상 색인 변환과 같이 PNG 압축에 사용되는 여러 기본 기법은 WebP에서도 지원되므로 최악의 경우 속도와 압축 밀도가 유사합니다. 동시에 다양한 색상 채널을 위한 별도의 엔트로피 코드, 역방향 참조 거리의 2D 지역, 최근 사용된 색상의 색상 캐시와 같은 여러 새로운 기능을 통해 대부분의 이미지에서 압축 밀도를 개선할 수 있습니다.

이 작업에서는 WebP의 성능을 pngcrush 및 ZopfliPNG를 사용하여 고도로 압축된 PNG와 비교합니다. 권장사항을 사용하여 웹 이미지의 참조 코퍼스를 다시 압축하고 이 코퍼스를 기준으로 무손실 및 손실이 있는 WebP 압축을 모두 비교했습니다. 참조 자료 외에도 속도와 메모리 사용량 벤치마킹을 위해 큰 이미지 두 개를 선택했습니다(사진과 그래픽 이미지 중 하나).

PNG보다 빠른 디코딩 속도는 물론 최신 PNG 형식을 사용할 때보다 23% 더 밀도 있는 압축률이 입증되었습니다. WebP가 오늘날의 PNG 이미지 형식을 더 효율적으로 대체한다고 결론을 내렸습니다. 또한 무손실 알파 지원을 통한 손실(lossy) 이미지 압축은 웹사이트 속도를 높일 수 있는 추가 가능성을 제공합니다.

방법

명령줄 도구

다음 명령줄 도구를 사용하여 성능을 측정합니다.

  1. cwebp 및 dwebp. libwebp 라이브러리의 일부인 이러한 도구 (헤드에서 컴파일됨)

  2. 있습니다. ImageMagick 소프트웨어의 명령줄 도구 부분입니다(6.7.7-10 2017-07-21).

  3. pngcrush 1.8.12 (2017년 7월 30일)

  4. ZopfliPNG (2017년 7월 17일)

명령줄 도구를 각각의 제어 플래그와 함께 사용합니다. 예를 들어 cwebp -q 1 -m 0을 언급하면 cwebp 도구가 -q 1 및 -m 0 플래그로 호출되었음을 의미합니다.

이미지 코퍼스

3개의 코퍼스가 선택되었습니다.

  1. 단일 사진 이미지 (그림 1)

  2. 반투명의 단일 그래픽 이미지 (그림 2)

  3. 웹 코퍼스: 인터넷에서 크롤링된, 반투명성 또는 그렇지 않은 무작위로 선택된 PNG 이미지 12,000개 이러한 PNG 이미지는 변환, pngcrush, ZopfliPNG를 통해 최적화되며 각 이미지의 가장 작은 버전이 연구에 고려됩니다.

그림 1. 1024x752픽셀 크기의 사진 이미지 불을 뿜는 숨 '자이푸르 마하라자 브라스 밴드' Chassepierre Belgium, 작성자: Luc Viatour, 크리에이티브 커먼즈 저작자표시-동일조건 변경 허락 3.0 라이선스에 따라 사용이 허가된 사진 작성자 웹사이트는 여기에서 확인할 수 있습니다.

그림 2. 그래픽 이미지(1024x752픽셀) Google Chart Tools의 콜라주 이미지

기존 형식인 PNG의 전체 기능을 측정하기 위해 몇 가지 방법을 사용하여 이러한 모든 원본 PNG 이미지를 다시 압축했습니다.

  1. 구성요소당 8비트로 고정: conversion input.png -depth 8 output.png

  2. 예측자가 없는 ImageMagick(1): conversion input.png -quality 90 output-candidate.png

  3. 적응형 예측자가 있는 ImageMagick: conversion input.png -quality 95 output-candidate.png

  4. Pngcrush(2): pngcrush -brute -rem tEXt -rem tIME -rem iTXt -rem zTXt -rem gAMA -rem cHRM -rem iCCP -rem sRGB -rem alla -rem text input.png output-candidate

  5. ZopfliPNG(3): zopflipng --lossy_ 도용 input.png output-candidate.png

  6. 모든 필터가 포함된 ZopfliPNG: zopflipng --iterations=500 --filters=01234mepb --lossy_8bit --lossy_ 직장 입력한.png output-candidate.png

결과

다음 세 가지 방법으로 최적화된 PNG 이미지 크기를 기준으로 웹 코퍼스의 각 이미지의 압축 밀도를 계산했습니다.

  1. WebP 무손실 (기본 설정)

  2. 가장 작은 크기의 WebP 무손실 (-m 6 -q 100)

  3. 알파를 적용한 WebP 무손실 및 WebP 손실 (기본 설정)의 가장 좋은 버전을 확인하세요.

이러한 압축 계수를 정렬하고 그림 3에 표시했습니다.

그림 3. PNG 압축 밀도가 1.0에서 참조로 사용됩니다. 동일한 이미지가 무손실 메서드와 손실 메서드를 모두 사용하여 압축됩니다. 각 이미지마다 압축된 PNG에 대한 크기 비율이 계산되고, 크기 비율이 정렬되어 무손실 압축과 손실이 있는 압축 모두에 대해 표시됩니다. 손실(lossy) 압축 곡선의 경우 더 작은 WebP 이미지를 생성하는 경우에 무손실 압축이 선택됩니다.

WebP는 최대 품질의 libpng 및 최대 품질 (변환)의 libpng 및 인코딩 (표 2) 및 디코딩 (표 3) 속도가 PNG 속도와 거의 비슷한 ZopfliPNG (표 1)에 대해 PNG 압축 밀도를 넘어섭니다.

표 1. 서로 다른 압축 방법을 사용하는 3개의 코퍼스의 평균 픽셀당 비트입니다.

이미지 세트 변환 -품질 95 ZopfliPNG WebP 무손실 -q 0 -m 1 WebP 무손실 (기본 설정) WebP 무손실 -m 6 -q 100 알파를 사용한 WebP 손실
사진 12.3 12.2 10.5 10.1 9.83 0.81
그래픽 1.36 1.05 0.88 0.71 0.70 0.51
웹 6.85 5.05 4.42 4.04 3.96 1.92

표 2. 압축 코퍼스 및 다양한 압축 방법의 평균 인코딩 시간입니다.

이미지 세트 변환 -품질 95 ZopfliPNG WebP 무손실 -q 0 -m 1 WebP 무손실 (기본 설정) WebP 무손실 -m 6 -q 100 알파를 사용한 WebP 손실
사진 0.500초 8.7초 0.293초 0.780초 8.440초 0.111초
그래픽 0.179초 14.0초 0.065초 0.140초 3.510초 0.184초
웹 0.040초 1.55초 0.017초 0.072초 2.454초 0.020초

표 3. 서로 다른 메서드와 설정으로 압축된 이미지 파일의 코퍼스 3개 평균 디코딩 시간입니다.

이미지 세트 변환 -품질 95 ZopfliPNG WebP 무손실 -q 0 -m 1 WebP 무손실 (기본 설정) WebP 무손실 -m 6 -q 100 알파를 사용한 WebP 손실
사진 0.027초 0.026초 0.027초 0.026초 0.027달러 0.012초
그래픽 0.049초 0.015초 0.005초 0.005초 0.003 0.010초
웹 0.007초 0.005초 0.003초 0.003초 0.003 0.003초

메모리 프로파일링

메모리 프로파일링의 경우 /usr/bin/time -v에 보고된 최대 상주 세트 크기를 기록했습니다.

웹 코퍼스의 경우 가장 큰 이미지의 크기만으로 최대 메모리 사용량이 정의됩니다. 메모리 측정값을 더 잘 정의하기 위해 단일 사진 이미지 (그림 1)를 사용하여 메모리 사용량 개요를 제공합니다. 그래픽 이미지에서도 비슷한 결과를 제공합니다.

libpng 및 ZopfliPNG의 경우 각각 10~19MiB, WebP 무손실 인코딩의 경우 -q 0 -m 1 및 -q 95 (기본값 -m)에서 각각 25MiB와 32MiB를 측정했습니다.

디코딩 실험에서 변환 -resize 1x1은 libpng 및 ZopfliPNG에서 생성된 PNG 파일 모두에 10MiB를 사용합니다. cwebp를 사용하는 경우 WebP 무손실 디코딩은 7MiB를 사용하고 손실(lossy) 디코딩 3MiB를 사용합니다.

결론

인코딩 및 디코딩 속도가 PNG 속도와 동일한 도메인에 있는 것으로 확인되었습니다. 인코딩 단계 중에는 메모리 사용량이 증가하지만 디코딩 단계에서는 최소한 cwebp의 동작을 ImageMagick의 변환의 동작과 비교할 때 정상적인 감소를 보여줍니다.

압축 밀도는 웹 이미지의 99% 이상에서 더 좋으며, PNG에서 WebP로 쉽게 변경할 수 있음을 나타냅니다.

WebP를 기본 설정으로 실행하면 libpng보다 42%, ZopfliPNG보다 23% 더 잘 압축됩니다. 이는 WebP가 이미지가 많은 웹사이트의 속도를 높일 수 있음을 시사합니다.

참조

  1. ImageMagick

  2. Pngcrush

  3. ZopfliPNG

다음은 Google에서 후원하지 않는 독립적인 연구이며 Google이 모든 콘텐츠의 정확성을 보증하지는 않습니다.

  1. Yoav Weiss 블로그