이미지 용량 줄이기

목표 용량 모드가 품질을 찾는 방법

JPEG와 WebP 인코더는 0~1 사이의 품질 값을 받지만, 파일 크기는 역으로 계산할 수 있는 공식이 아니라서 이분 탐색을 씁니다. 먼저 가장 낮은 품질(0.1)로 인코딩해 보고, 이미 들어맞으면 품질 범위 0.1~1.0에서 중간값으로 인코딩해 결과가 목표 안에 들어오면 그 파일을 보관하고 더 높은 품질을, 들어오지 않으면 더 낮은 쪽을 찾습니다. 아홉 번 반복하면 범위가 약 0.002로 좁혀지고 목표에 들어온 파일 중 가장 좋은 것이 남습니다.

KB는 1KB = 1024바이트로 환산합니다. 200KB는 204,800바이트, 5,000KB는 5,120,000바이트입니다. 가장 낮은 품질에서도 목표보다 크면 크기를 줄입니다. 다음 배율은 현재 배율에 sqrt(제한 / 용량) x 0.97을 곱한 값이며 현재 배율의 30%~90% 범위로 제한하고, 가장 낮은 품질 시도를 다시 합니다. 가장 낮은 품질 파일이 600KB인 4032 x 3024 사진을 200KB 제한에 맞추면 배율 0.56, 즉 2258 x 1693이 됩니다. 가장 낮은 품질이 처음 들어맞는 배율에서 아홉 번의 품질 탐색을 합니다. 배율은 원본의 10% 아래로 내려가지 않으며, 그 아래이거나 스위치가 꺼져 있으면 제한을 넘는 파일을 내놓지 않고 목표가 너무 작다고 알려 줍니다.

배율 = 1
encode(배율, 0.1)이 목표보다 큰 동안:
  배율 = 배율 * clamp(sqrt(목표 / 용량) * 0.97, 0.3, 0.9)
  (배율 < 0.1이거나 크기 조절이 꺼져 있으면 오류로 중단)

범위 = [0.1, 1.0]
9회 반복:
  q = (low + high) / 2
  blob = encode(image, format, q)
  if size(blob) <= target: blob 보관; low = q
  else: high = q

매번 목표에 들어올 때:  0.55, 0.775, 0.8875, 0.94375, 0.971875, 0.9859375, 0.99296875, 0.996484375, 0.9982421875
한 번도 못 들어올 때:   0.55, 0.325, 0.2125, 0.15625, 0.128125, 0.1140625, 0.10703125, 0.103515625, 0.1017578125 -> 0.1 파일 유지
크기를 줄이는 예:       품질 0.1에서 600KB, 제한 200KB -> 배율 0.56 (2258 x 1693)

손실 압축과 무손실 압축

JPEG와 WebP는 손실 압축입니다. 품질을 낮추면 눈에 가장 덜 띄는 미세한 디테일부터 버려지므로 사진 용량이 크게 줄어듭니다. 같은 눈에 보이는 품질에서는 보통 WebP가 JPEG보다 작습니다. PNG는 무손실이라 품질 모드에서 PNG를 고르면 슬라이더가 적용되지 않고, 사진을 PNG로 다시 저장하면 오히려 커지는 일이 많습니다. 그러면 결과 줄에 줄어듦 대신 커짐이 표시됩니다.

절감률은 round((이전 - 이후) / 이전 x 100)으로 계산합니다. 1,000바이트 파일이 650바이트가 되면 35% 줄어든 것이고, 1,200바이트가 되면 20% 커진 것입니다.

다시 인코딩하면 달라지는 것

이미지를 캔버스에 그려 다시 인코딩하므로 EXIF GPS 좌표와 카메라 정보는 결과에 이어지지 않습니다. JPEG로 바꾸면 투명 픽셀이 흰색과 합쳐집니다. 원본 광색역 프로필은 사라지고 색은 sRGB로 변환되며, Chrome은 JPEG 결과에 표준 sRGB ICC 프로필을 붙일 수 있습니다.

파일 용량을 좌우하는 가장 큰 요소는 해상도입니다. 전체 이미지가 브라우저 캔버스 한도를 넘으면 목표 용량 모드는 기기에서 처리 가능한 축소 배율부터 시작합니다. 가로와 세로를 절반으로 줄이면 픽셀 수는 4분의 1입니다. 정확한 크기가 필요하면 먼저 크기를 조절하세요.