Image Optimization
이미지 최적화 (웹 성능)
시각적 품질을 허용 가능한 수준으로 유지하면서 이미지 파일 크기를 줄이는 기술의 총칭으로, 웹 페이지 로드 시간을 단축하고 대역폭을 절약합니다.
기술 세부사항
이미지 최적화에는 형식 선택(WebP/AVIF가 JPEG/PNG보다 우수), 손실 품질 튜닝(JPEG 75-85%가 최적), 무손실 재압축(Zopfli PNG, MozJPEG), 메타데이터 제거(EXIF/XMP), 반응형 이미지(srcset/sizes), 지연 로딩(loading='lazy'), CDN 기반 변환(Cloudflare Polish, CloudFront 등)이 포함됩니다.
예시
```javascript
// Image compression via Canvas
canvas.toBlob(
blob => console.log(`Size: ${(blob.size/1024).toFixed(0)} KB`),
'image/jpeg',
0.8 // quality: 0.0 (smallest) to 1.0 (best)
);
// WebP output (25-34% smaller than JPEG)
canvas.toBlob(cb, 'image/webp', 0.8);
```