Đã ghi lại 5 giây thao tác演示, xuất thành GIF, nhìn kích thước: 18 MB.
Muốn dán vào tài liệu, gửi vào nhóm, đưa vào README, thì không phải lỗi tải lên, phải chờ tải lâu.
Tại sao một tấm "ảnh động" lại lớn hơn cả một đoạn video? Làm thế nào để nén nó nhỏ lại mà không bị đầy màn hình nhiễu hạt?
Tìm hiểu trước: Tại sao GIF lại to đến thế
GIF là định dạng năm 1987, một vài thiết kế tiên quyết của nó quyết định nó "mập":
- Mỗi khung là một bức ảnh hoàn chỉnh. Không có nén khung giữa kiểu "chỉ ghi lại sự thay đổi" như video—trừ khi được tối ưu hóa khi xuất, thì 100 khung là 100 bức ảnh.
- Thuật toán nén rất cũ. GIF chỉ dùng nén LZW không mất dữ liệu, giỏi cho "các màu liên tiếp giống nhau", gặp chuyển màu, ảnh chụp, chi tiết mịn thì gần như không nén được.
- Tối đa 256 màu mỗi khung. Màu không đủ, công cụ xuất dùng "nhiễu hạt" (dithering)—dùng chấm nhiễu rải rác để mô phỏng chuyển màu. Những chấm này nhìn bằng mắt thường là mượt mà, nhưng đối với LZW thì lại là dữ liệu khó nén nhất.
Vì vậy kích thước của một GIF phụ thuộc vào: kích thước × số khung × mức độ "mịn" của mỗi khung. Tất cả các cách dưới đây đều tác động vào ba yếu tố này.
6 cách, sắp xếp theo mức độ mất mát chất lượng từ thấp đến cao
1. Tối ưu khung: chỉ lưu "vùng đã thay đổi" (không mất dữ liệu)
Nhiều công cụ ghi màn hình, phần mềm thiết kế xuất GIF, mỗi khung đều lưu toàn bộ bức ảnh. Nhưng trong một thao tác演示, thường chỉ có chuột và một vùng nhỏ chuyển động.
Tối ưu khung làm việc như sau: Mỗi khung chỉ giữ lại vùng hình chữ nhật khác với khung trước, phần không đổi biểu thị bằng pixel trong suốt. Các pixel trong suốt liên kết thành một vùng, LZW nén rất hiệu quả.
Màn hình một pixel cũng không đổi, hiệu ứng hoạt ảnh hoàn toàn giống nhau, chỉ cách lưu trữ thông minh hơn. Với GIF có "nền không đổi, phần chuyển động" (ghi màn hình,演示 UI, icon), bước này có thể tiết kiệm được khá nhiều.
2. LZW có mất dữ liệu: "cho phép hơi lệch màu" trong thuật toán nén (không mất dữ liệu về mặt thị giác)
Đây là tư duy từ tham số --lossy của gifsicle: trong quá trình mã hóa cho phép có sự lệch màu cực nhỏ, khiến nhiều pixel được coi là "cùng một màu" kết nối lại, do đó hiệu quả của LZW tăng mạnh.
Đặc điểm của nó: không giảm số lượng màu, không đổi kích thước, không động khung, chi phí là xuất hiện một chút hạt nhỏ trên màn hình. Giá trị càng lớn, tiết kiệm càng nhiều, hạt càng rõ. Khi dùng nhẹ (ví dụ --lossy=30~40), ở khoảng cách nhìn thường rất khó để nhận ra.
3. Giảm màu sắc: từ 256 xuống 128 hoặc 64
Chuyển bảng màu từ 256 xuống 128 hoặc 64 màu, lượng thông tin cần cho mỗi pixel giảm đi, hiệu quả nén tăng lên.
Với phong cách phẳng, minh họa, icon, GIF giao diện, màu vốn không nhiều, giảm màu gần như không mất gì; nhưng với ảnh chụp, nhiều chuyển màu, giảm màu sẽ xuất hiện các vệt màu và mảng rõ.
4. Giảm khung: giảm tốc độ khung hình
Nhiều GIF được xuất ở 30 fps hoặc thậm chí 60 fps, nhưng GIF bản thân không giỏi tốc độ khung cao, nhiều cảnh 10~15 fps đã đủ.
Giảm một nửa số khung, kích thước thường cũng giảm gần một nửa. Chi phí là di chuyển không mượt—đối với演示 thao tác không ảnh hưởng nhiều, nhưng với các hoạt ảnh cần sự mượt mà thì rõ rệt.
5. Thu nhỏ kích thước
Kích thước tỷ lệ thuận với số điểm ảnh: giảm một nửa chiều rộng và chiều cao, số điểm ảnh chỉ còn một phần tư.
Khi ghi màn hình trên màn hình Retina, chiều rộng gốc có thể hơn 2000 điểm ảnh, nhưng nó thường chỉ hiển thị ở vị trí rộng khoảng 600~800 pixel. Xuất theo kích thước hiển thị thực tế thường là bước mang lại lợi ích lớn nhất. Chi phí là phóng to sẽ bị mờ, nội dung dạng chữ cần lưu ý khả năng đọc.
6. Đổi định dạng: đổi GIF thành video hoặc WebP
Nếu nền tảng cho phép, cách triệt để nhất là không dùng GIF:
- MP4 / WebM: Mã hóa video hiện đại có nén khung giữa, cùng một nội dung, kích thước thường chỉ bằng một phần nhỏ của GIF. Trên web dùng
<video autoplay loop muted playsinline>để tạo hiệu ứng giống GIF. - Dynamic WebP / APNG: Hỗ trợ nhiều màu và nén tốt hơn, các trình duyệt hiện đại đều có thể phát.
Chi phí là tính tương thích: nhiều phần mềm chat, diễn đàn, công cụ tài liệu, ứng dụng email chỉ chấp nhận GIF, đổi định dạng có thể không hiển thị, hoặc không tự động phát.
Một bảng để thấy rõ sự đánh đổi
| Cách | Ảnh hưởng chất lượng | Phù hợp | Không phù hợp |
|---|---|---|---|
| Tối ưu khung | Không, không đổi pixel | Tất cả GIF, đặc biệt ghi màn hình và hoạt ảnh phần tử | ——(nên luôn làm) |
| LZW có mất dữ liệu (nhẹ) | Hạt nhỏ cực nhẹ | Hầu hết GIF | Hạt cực nhạy với tranh pixel |
| Giảm màu | Xuất hiện vệt màu ở vùng chuyển màu | Phong cách phẳng, icon, giao diện | Ảnh chụp, nhiều chuyển màu |
| Giảm khung | Di chuyển kém mượt | Thao tác演示, hoạt ảnh phần nhiều tĩnh | Hoạt ảnh cần mượt mà |
| Thu nhỏ kích thước | Chi tiết ít đi | Ảnh gốc lớn hơn kích thước hiển thị | Nội dung dạng chữ cần nhìn rõ |
| Đổi định dạng | Thường tốt hơn | Web, nền tảng có thể kiểm soát | Chỉ chấp nhận GIF |
Logic của thứ tự là: làm trước những cách không mất hoặc gần như không mất, rồi tiếp tục theo nhu cầu. Sau hai bước đầu tiên nếu đã đủ nhỏ, không cần hy sinh màu, tốc độ khung hình hay kích thước.
Hai bước đầu tiên, ImgZilla có thể làm hàng loạt cho bạn
Nếu bạn có một đống GIF—bộ sưu tập icon, GIF trong tài liệu, thư mục tài nguyên web—mỗi cái bỏ vào công cụ trực tuyến chỉnh tham số thật mệt.
ImgZilla là công cụ nén ảnh cho macOS, khi xử lý GIF nó dùng chính hai bước đầu tiên trong bảng trên:
- Dựa trên gifsicle: Làm tối ưu khung mức cao nhất (tương đương
-O3), sau đó cộng thêm LZW có mất dữ liệu nhẹ (tương đương--lossy=40). - Không giảm màu, không cắt khung, không đổi kích thước, không đổi vòng lặp. Hoạt ảnh vẫn là hoạt ảnh cũ, tốc độ khung, thời lượng, độ phân giải không đổi, chỉ là file nhỏ hơn.
- Nén ngay tại chỗ: Tên file, đường dẫn, định dạng không đổi. GIF được trích dẫn trong tài liệu, web, Markdown như
demo.gifsau khi nén vẫn làdemo.gif, không cần sửa bất kỳ liên kết nào. - Kéo cả thư mục vào: Quét đệ quy thư mục con, xử lý GIF cùng với JPG, PNG, WebP và các loại ảnh khác.
- Không ép nén nếu không thể: Các file đã được tối ưu hóa, tỷ lệ nén dưới 0,4% sẽ được đánh dấu "đã tối thiểu", giữ nguyên, không trừ số lượng dùng thử miễn phí.
- File gốc mặc định vào thùng rác: Nếu không hài lòng với hiệu quả nào, chuột phải "Phục hồi" để lấy lại.
- Chạy hoàn toàn trên máy tính, không tải lên bất kỳ máy chủ nào, không có giới hạn kích thước file hay số lượng như công cụ trực tuyến—GIF ghi màn hình vài chục MB vẫn xử lý được.
Tiết kiệm được bao nhiêu phụ thuộc vào GIF gốc được xuất như thế nào. GIF ghi màn hình chưa tối ưu khung, phần lớn画面 tĩnh thường tiết kiệm được nhiều nhất; GIF đã được chuyên dụng nén thì có thể chỉ còn chút dư, thậm chí được đánh dấu "đã tối thiểu"—điều này bình thường.
Những thứ ImgZilla không làm
Để "màn hình hoạt ảnh không đổi", ImgZilla không làm thay bước 3~6 cho bạn. Nếu sau hai bước đầu tiên vẫn còn quá lớn, ví dụ bắt buộc phải nén dưới giới hạn của nền tảng, thì bạn cần tự quyết định hy sinh cái gì:
bash
Dùng lệnh gifsicle: giảm xuống 128 màu, chiều rộng thu nhỏ 640, nén có mất dữ liệu mạnh hơn
gifsicle -O3 --lossy=80 --colors 128 --resize-width 640 input.gif -o output.gif
Dùng ffmpeg chuyển GIF thành MP4 (kích thước thường nhỏ hơn nhiều)
ffmpeg -i input.gif -movflags +faststart -pix_fmt yuv420p
-vf "scale=trunc(iw/2)*2:trunc(ih/2)*2" output.mp4
Việc cắt khung, cắt thời lượng cần chọn từng khung, nên dùng trình chỉnh sửa trực tuyến như ezgif sẽ dễ nhìn hơn.
Một thói quen tốt hơn: không xuất GIF quá lớn ngay từ nguồn
Ba lời khuyên cuối cùng giúp bạn ít phải nén lại nhiều lần trong tương lai:
- Trước khi ghi màn hình, thu nhỏ cửa sổ lại, chỉ ghi lại vùng cần thiết, không phải toàn màn hình Retina.
- Khi xuất, chọn 10~15 fps, hầu hết các演示 đều đủ.
- Sau khi xuất, nén một lần nữa, làm tối ưu khung và LZW nhẹ—bước này không cần suy nghĩ, rất hợp để giao cho công cụ làm hàng loạt.
GIF là định dạng cũ, nhưng nó vẫn là "số lớn chung" cho việc phát tự động ở mọi nơi. Thay vì đau đầu có nên bỏ nó, hãy để mỗi GIF chỉ chiếm đúng chỗ cần thiết.
ImgZilla hiện chỉ hỗ trợ macOS (12.3 trở lên), có thể tải từ Mac App Store. Phiên bản miễn phí nén được 10 ảnh mỗi ngày, chỉ tính vào số lượng nếu nén thành công—chỉ cần kéo cả thư mục chứa GIF vào, xem được tiết kiệm được bao nhiêu.