basejb Image Optimizer
이미지 파일을 WebP 포맷으로 변환하여 화질 손실 없이 용량을 대폭 줄이는 스킬입니다.
When to Use This Skill
- "이미지 리사이즈해줘", "용량 줄여줘", "webp로 변환해줘" 등의 요청
- S3 업로드 전 이미지 최적화가 필요할 때
- 디렉토리 내 이미지 일괄 변환이 필요할 때
필수 도구
cwebp(libwebp) — macOS:brew install webp
워크플로우
1. 원본 정보 확인
sips -g pixelWidth -g pixelHeight -g format "{파일경로}" && ls -lh "{파일경로}" | awk '{print "filesize:", $5}'
2. WebP 변환
단일 파일
cwebp -q 90 -m 6 "{입력파일}" -o "{출력파일.webp}"
디렉토리 일괄 처리
for f in "{디렉토리}"/*.{png,jpg,jpeg}; do
[ -f "$f" ] && cwebp -q 90 -m 6 "$f" -o "${f%.*}.webp"
done
3. 결과 확인
ls -lh "{출력파일.webp}" | awk '{print $5}'
파라미터 가이드
| 옵션 | 값 | 설명 |
|---|---|---|
-q |
90 |
품질 (기본값). 화질 우선이면 95, 용량 우선이면 80 |
-m |
6 |
압축 강도. 6이 최대 (가장 느리지만 가장 작은 용량) |
-resize W H |
1200 0 |
리사이즈. 높이 0은 비율 유지. 해상도 축소가 필요할 때만 사용 |
-lossless |
— | 무손실 모드. PNG 대체용으로 화질 100% 유지하되, 용량 감소 효과는 적음 |
상황별 추천 설정
| 용도 | 명령 |
|---|---|
| 일반 (화질 우선) | cwebp -q 90 -m 6 |
| 웹 썸네일 | cwebp -q 85 -m 6 -resize 600 0 |
| 상세페이지 이미지 | cwebp -q 90 -m 6 -resize 1200 0 |
| 무손실 (PNG 대체) | cwebp -lossless -m 6 |
| 최대 압축 (용량 우선) | cwebp -q 75 -m 6 |
출력 규칙
- 출력 파일명: 원본과 동일한 이름에
.webp확장자 - 출력 위치: 원본과 같은 디렉토리 (덮어쓰기 없음 — 확장자가 다르므로)
- 변환 완료 후 원본/결과 용량 비교를 사용자에게 보고
예시
입력: product-front.png (5.9MB, 1792x2400)
출력: product-front.webp (539KB, 1792x2400)
결과: 91% 용량 감소, 해상도 유지, q90 고품질