Cùng là việc "nén WebP", mục đích của mỗi người hoàn toàn khác nhau:
Một số muốn chuyển một loạt file JPG, PNG sang WebP; một số đang sở hữu WebP và muốn nén nhỏ hơn nữa;还有人 muốn xử lý WebP động.
Không có công cụ nào tuyệt đối tốt hơn, chỉ có phù hợp. Bài viết gợi ý theo từng trường hợp, mỗi trường hợp chỉ đưa ra 1-2 công cụ dễ sử dụng nhất.
Trước khi bắt đầu: 2 phút để hiểu về WebP
Thực tế WebP có ba dạng:
- WebP mất dữ liệu (Lossy): Nguyên lý giống JPEG, bỏ bớt chi tiết dựa trên tham số chất lượng, dung lượng nhỏ, phù hợp cho ảnh chụp, Banner.
- WebP không mất dữ liệu (Lossless): Nguyên lý giống PNG, không thay đổi pixel nào, phù hợp cho ảnh chụp màn hình, tài nguyên UI.
- WebP động (Animated WebP): Nhiều khung hình hoạt hình, có thể mất dữ liệu hoặc không, thường xuất hiện từ các biểu tượng GIF chuyển đổi và hình động trình bày.
Nếu không chắc mình đang có loại nào, hãy dùng công cụ webpinfo của Google:
bash
brew install webp
webpinfo image.webp
Trong đầu ra có VP8 là mất dữ liệu, VP8L là không mất dữ liệu, có ANIM / ANMF là hình động.
Cũng có một điều đáng biết trước: WebP mất dữ liệu với tham số chất lượng cao hơn sẽ làm dung lượng tăng, nhưng chất lượng hình ảnh không được cải thiện — chi tiết bị mất không thể lấy lại. Vì vậy đối với các file đã là WebP, công cụ nén tốt nên có thể xác định "không nén được thì không nén".
Trường hợp 1: Chuyển JPG / PNG theo lô sang WebP
Đây là việc mà hầu hết mọi người làm lần đầu tiên khi tiếp xúc với WebP.
Nếu dùng giao diện người dùng, hãy chọn XnConvert. Miễn phí, đa nền tảng, có thể kéo một nhóm ảnh vào cùng lúc, thiết lập chất lượng hoặc chế độ không mất dữ liệu cho WebP, vừa thay đổi kích thước, vừa đổi tên file. Việc chuyển định dạng này, nó là cách dễ nhất.
Nếu đưa vào quy trình xây dựng, hãy chọn cwebp hoặc sharp. Trong dự án web, thay vì chuyển thủ công, hãy tự động xử lý khi đóng gói hoặc tải lên CDN:
bash
cwebp: chất lượng 75, cách mã hóa chậm nhất nhưng tiết kiệm nhất, giữ profile màu
cwebp -q 75 -m 6 -metadata icc input.jpg -o output.webp
js
// sharp (Node.js)
await sharp('input.jpg').webp({ quality: 75, effort: 6 }).toFile('output.webp')
Nếu chưa chắc chắn về tham số? Hãy thử Squoosh trước. Công cụ trực tuyến của Google, xử lý từng ảnh một, nhưng có thể chia đôi màn hình, kéo thả chất lượng theo thời gian thực. Hãy hiểu rõ "ảnh loại này nên dùng chất lượng bao nhiêu", sau đó điền các tham số vào các công cụ xử lý theo lô ở trên.
Trường hợp 2: Đã là WebP, muốn nén nhỏ hơn nữa
Website đã chuyển sang WebP từ lâu, Lighthouse vẫn đề xuất "ảnh có thể nén thêm"; hoặc một loạt file WebP trong thư mục tài nguyên đang chiếm chỗ. Lúc này không cần chuyển đổi định dạng, mà là nén nhỏ hơn trực tiếp trên file hiện có.
Người dùng Mac: ImgZilla
ImgZilla là công cụ nén ảnh macOS do chúng tôi xây dựng, đây chính là trường hợp nó làm tốt nhất:
- Nén trực tiếp, đường dẫn không đổi. Sau khi nén
banner.webpvẫn làbanner.webp, dòng trích dẫn trong web, code, tài liệu không cần sửa gì cả. - Kéo cả thư mục vào. Quét đệ quy tất cả thư mục con, tự động bỏ qua các file ẩn và
node_modules; có thể xử lý hết cả WebP và JPG, PNG, GIF, AVIF, HEIC, SVG lẫn lộn trong một lần. - Không cần chỉnh tham số. Sử dụng mã hóa libwebp của Google, chất lượng 75, mức nỗ lực 4, tương đương với tham số mặc định của Squoosh; kênh trong suốt được giữ với chất lượng cao nhất, nền trong suốt không bị mờ viền.
- Không ép nén khi không cần. Sau khi mã hóa lại nếu không giảm dung lượng (mức nén dưới 0,4%), nó sẽ được đánh dấu "Đã tối thiểu" và giữ nguyên file gốc, không gửi file lớn hơn cho bạn, cũng không trừ số lượng miễn phí.
- Có thể hủy bỏ. File gốc mặc định được chuyển vào thùng rác, nếu thấy ảnh nào không hài lòng, nhấp chuột phải "Thả lại ở đây" là được.
- Chạy hoàn toàn cục bộ, tài nguyên không được tải lên bất kỳ máy chủ nào.
👉 Tải ImgZilla từ Mac App Store
Các nền tảng khác: Caesium hoặc TinyPNG
- Caesium Image Compressor: Miễn phí và mã nguồn mở, có thể dùng trên Windows, macOS, Linux, hỗ trợ nén WebP theo lô, có thể thiết lập chất lượng và giữ lại siêu dữ liệu hay không.
- TinyPNG: Công cụ trực tuyến, cũng hỗ trợ WebP. Chỉ cần kéo vào là xong, nhưng phiên bản miễn phí có giới hạn về số lượng và dung lượng, ảnh cần được tải lên máy chủ của bên thứ ba.
Trường hợp 3: WebP động
Yêu cầu hình động chia làm hai loại:
Chuyển GIF sang WebP động: Dùng công cụ gif2webp chính thức của Google (có trong gói công cụ libwebp, trên Mac brew install webp là có). Cùng một hoạt ảnh, WebP động thường nhỏ hơn GIF nhiều.
bash
gif2webp -q 75 -m 6 input.gif -o output.webp
WebP động hiện có muốn nén nhỏ hơn nữa: Nhiều công cụ gặp file động sẽ báo lỗi, hoặc chỉ giữ khung hình đầu tiên. ImgZilla hỗ trợ nén lại WebP động — mã hóa lại từng khung, giữ nguyên số khung, thời lượng mỗi khung, số lần lặp lại, kích thước canvas; hoạt ảnh vẫn là hoạt ảnh cũ, chỉ là file nhỏ hơn. Giống như ảnh tĩnh, nếu không giảm được thì sẽ đánh dấu "Đã tối thiểu" và giữ nguyên file gốc.
Trường hợp 4: Phải giữ nguyên pixel
Tải cắt UI phải khớp chính xác với bản thiết kế, chụp màn hình cần so sánh pixel cho từng điểm, tài nguyên sau này cần tiếp tục chỉnh sửa — các trường hợp này yêu cầu không mất dữ liệu.
Sử dụng cwebp:
bash
Hoàn toàn không mất dữ liệu
cwebp -lossless -z 9 input.png -o output.webp
Gần không mất dữ liệu: có sự thay đổi cực nhỏ về pixel, nhưng nhỏ hơn nhiều so với hoàn toàn không mất, phù hợp cho chụp màn hình và UI
cwebp -near_lossless 60 input.png -o output.webp
Lưu ý: ImgZilla sử dụng mã hóa mất dữ liệu cho WebP, bao gồm cả WebP vốn đã là không mất dữ liệu. Dung lượng thường sẽ giảm đáng kể, nhưng pixel không còn trùng khớp từng điểm. Ngoài ra, nó sẽ loại bỏ siêu dữ liệu trong WebP (bao gồm profile màu), ảnh sRGB thông thường không bị ảnh hưởng, các ảnh có profile màu rộng như Display P3 có thể có chút khác biệt trong phần mềm quản lý màu. Với các ảnh có yêu cầu khắt khe về pixel và màu sắc, hãy sử dụng cwebp, hoặc tách ra trước khi nén.
Bảng tóm tắt
| Bạn cần làm | Khuyên dùng | Thay thế |
|---|---|---|
| Chuyển JPG / PNG theo lô sang WebP | XnConvert | cwebp, sharp (quy trình xây dựng) |
| Thử tham số, xử lý một ảnh | Squoosh | — |
| Nén lại WebP hiện có (Mac) | ImgZilla | Caesium |
| Nén lại WebP hiện có (Windows / Linux) | Caesium | TinyPNG |
| Chuyển GIF sang WebP động | gif2webp | — |
| Nén lại WebP động hiện có | ImgZilla | Viết script bằng libwebp tự làm |
| Phải giữ nguyên pixel | cwebp -lossless / -near_lossless |
— |
Link tải xuống
| Công cụ | Nền tảng | Giá | Tải xuống |
|---|---|---|---|
| ImgZilla | macOS 12.3+ | Miễn phí 10 ảnh/ngày | Mac App Store |
| XnConvert | Windows / macOS / Linux | Cá nhân miễn phí | xnview.com |
| Caesium Image Compressor | Windows / macOS / Linux | Miễn phí, mã nguồn mở | saerasoft.com |
| cwebp / gif2webp / webpinfo | Dòng lệnh | Miễn phí, mã nguồn mở | Tải về chính thức của Google, Mac: brew install webp |
| sharp | Node.js | Miễn phí, mã nguồn mở | sharp.pixelplumbing.com, npm install sharp |
| Squoosh | Trực tuyến | Miễn phí | squoosh.app |
| TinyPNG | Trực tuyến | Miễn phí có giới hạn | tinypng.com |
Lời kết
WebP bản thân đã là một định dạng rất hiệu quả. Nếu WebP của bạn được tạo ra bởi CDN hoặc công cụ xây dựng với tham số hợp lý, không gian nén thêm có thể không lớn, việc thấy "Đã tối thiểu" là bình thường; những file thực sự tiết kiệm được nhiều hơn, thường là những file được xuất với tham số chất lượng cao, chuyển từ PNG không mất dữ liệu, hoặc chuyển trực tiếp từ GIF mà không được xử lý thêm nữa.
Hãy dùng webpinfo để xem rõ mình đang có loại gì, sau đó chọn công cụ theo từng trường hợp, sẽ tiết kiệm nhiều thời gian hơn so với thử qua mười công cụ.
ImgZilla hiện chỉ hỗ trợ macOS (12.3 trở lên), có thể tải xuống tại Mac App Store. Phiên bản miễn phí có thể nén 10 ảnh mỗi ngày, chỉ tính vào giới hạn khi nén thành công — hãy kéo một thư mục đầy WebP vào và xem tiết kiệm được bao nhiêu.