§

Kéo ảnh vào hoặc nhấp để chọn

JPEG, PNG, WebP — tối đa 30 MB mỗi file. Hỗ trợ hàng loạt.

Kéo nhiều ảnh để nén hàng loạt — tất cả quá trình xử lý diễn ra trên thiết bị của bạn.

Định dạng đầu ra
Chế độ nén
Chỉ JPEG và WebP — PNG không mất dữ liệu

Các nhóm web Việt Nam gặp phải bức tường tương tự trong mỗi sprint. Ảnh sản phẩm từ máy ảnh DSLR nặng 4 MB, Lighthouse gắn cờ, và giới hạn tải lên của CMS là 1 MB. Thả file vào đây, chọn JPEG ở chất lượng 0,7 hoặc đặt mục tiêu 400 KB, nhấn Nén, và lấy kết quả trong vòng một giây. Bản gốc vẫn ở trên laptop của bạn. Cách tương tự thu nhỏ lô ảnh chụp màn hình PNG cho ticket Jira, hoặc cắt giảm hero image để cửa hàng Shopify vượt qua Core Web Vitals. Các nhóm tuân thủ HIPAA hoặc trong ranh giới FedRAMP sử dụng công cụ phía trình duyệt vì lý do này: ảnh nguồn không thể hợp pháp chạm vào dịch vụ bên ngoài như TinyPNG, và trang này chạy hoàn toàn trong JavaScript.

// Công cụ liên quan

./image-format-converter
Công cụ chuyển đổi định dạng ảnh
Chuyển đổi PNG, JPEG và WebP tại chỗ — không tải lên, hỗ trợ hàng loạt.
→
./exif-stripper
Công cụ xóa EXIF
Xem và xóa metadata EXIF khỏi ảnh hoàn toàn trong trình duyệt của bạn.
→
./hash-generator
Bộ tạo mã băm
Tạo mã băm MD5, SHA-1, SHA-256 và SHA-512 ngay trong trình duyệt của bạn.
→
./
Tất cả công cụ
Duyệt toàn bộ bộ sưu tập công cụ trực tuyến của Ultim8Soft.
→

Cách nén ảnh trên trình duyệt hoạt động

Mỗi lần nén chạy hoàn toàn trong JavaScript. Không có thư viện codec nào được tải xuống và không có server nào liên quan. Canvas API tích hợp của trình duyệt giải mã ảnh, mã hóa lại ở chất lượng thấp hơn, và đưa cho bạn một Blob mà trang có thể xem trước, tải xuống, hoặc nén thành zip. Vì mọi bước đều nằm trong hộp cát của tab, các file gốc không bao giờ chạm đến mạng.

  1. Đọc từng file đã tải lên dưới dạng Blob và tạo URL đối tượng để trình duyệt có thể giải mã nó cục bộ, không cần sao chép byte lên server hay ghi vào ổ đĩa.
  2. Vẽ ảnh đã giải mã lên phần tử Canvas ngoài màn hình ở kích thước pixel gốc của nó, sẵn sàng để mã hóa lại.
  3. Gọi canvas.toBlob(callback, mimeType, quality) để mã hóa lại các pixel. Ở chế độ chất lượng, giá trị thanh trượt ánh xạ trực tiếp đến cài đặt lượng tử hóa của bộ mã hóa; ở chế độ kích thước mục tiêu, trang chia đôi giá trị chất lượng cho đến khi output blob vừa vặn dưới ngân sách byte của bạn.
  4. Hiển thị số liệu trước/sau với kích thước gốc, kích thước đã nén, và phần trăm tiết kiệm, sau đó cung cấp tải xuống từng ảnh hoặc một ZIP duy nhất cho toàn bộ lô. ZIP được tạo trong bộ nhớ bằng fflate, thư viện 8 KB được tải lần đầu sử dụng.

Tại sao nén ảnh?

  • Ảnh nhỏ hơn tải nhanh hơn. Cắt giảm hero image từ 4 MB xuống 600 KB cải thiện trực tiếp Largest Contentful Paint, một trong những Core Web Vitals mà Google dùng để xếp hạng. Trên trang có nhiều ảnh, khoản tiết kiệm cộng dồn thành lần hiển thị đầu tiên nhanh hơn.
  • Giới hạn tải lên và đính kèm có ở khắp nơi. Nhiều nền tảng CMS, công cụ theo dõi ticket, và hệ thống email từ chối file trên 1 hoặc 2 MB. Một lần nén nhanh giúp ảnh vượt qua giới hạn mà không cần mở editor đầy đủ.
  • Băng thông và lưu trữ tốn tiền khi ở quy mô lớn. Gửi WebP ở chất lượng 0,8 thay vì PNG kích thước đầy đủ có thể cắt giảm tải trọng ảnh một phần ba hoặc hơn, giảm hóa đơn egress CDN và lượng dữ liệu di động mà khách truy cập của bạn sử dụng.
  • Quyền riêng tư quan trọng với ảnh nhạy cảm. Vì mọi thứ chạy trong trình duyệt của bạn, ảnh chụp CMND, ảnh y tế, và ảnh chụp màn hình nội bộ vẫn ở trên thiết bị của bạn — không có việc tải lên server bên thứ ba như TinyPNG cần lo lắng.

Ứng dụng phổ biến

Nén xuất hiện bất cứ khi nào ảnh lớn hơn nơi nó sẽ đến. Ba khuôn mẫu chúng tôi thấy lặp đi lặp lại.

  • Chuẩn bị ảnh sản phẩm cho cửa hàng trực tuyến. Ảnh gốc JPEG được nén đến chất lượng 0,8 (hoặc mục tiêu 200 KB) để mặt tiền cửa hàng luôn nhanh và vượt qua Core Web Vitals trên di động.
  • Thu nhỏ ảnh chụp màn hình trước khi đính kèm vào bug tracker hoặc wiki. Lô ảnh chụp PNG chuyển sang JPEG ở chất lượng 0,85 thường giảm từ hàng chục megabyte xuống chỉ còn vài megabyte.
  • Đưa ảnh xuống dưới giới hạn tải lên — cổng nộp hồ sơ tuyển dụng từ chối file trên 1 MB, hệ thống email với giới hạn đính kèm chặt chẽ, hoặc avatar diễn đàn phải vừa với ngân sách byte.

Ví dụ thực tế: JPEG 4 MB xuống 400 KB

JPEG 4 MB thẳng từ camera điện thoại là tải trọng phổ biến vượt giới hạn tải lên và làm chậm trang. Đây là điểm chuẩn hợp lý cho những gì việc nén tiết kiệm được.

Thả JPEG vào vùng tải lên, để định dạng ở JPEG, và kéo thanh trượt chất lượng xuống 0,7 hoặc chuyển sang chế độ kích thước mục tiêu và nhập 400 KB. Ở chế độ chất lượng, pipeline Canvas mã hóa lại một lần và hiển thị kết quả, thường khoảng 500 đến 700 KB tùy ảnh. Ở chế độ kích thước mục tiêu, trang thử một vài giá trị chất lượng, chọn giá trị cao nhất vẫn vừa dưới 400 KB, và báo cáo phần trăm tiết kiệm. Nhấp Tải xuống trên thẻ để lấy file đơn lẻ, hoặc nhấp Tải .zip nếu bạn đã nén nhiều ảnh cùng lúc. Toàn bộ vòng lặp chạy trong vòng dưới một giây cho ảnh kích thước này và không tiêu thụ băng thông nào sau khi trang tự nó hoàn thành tải.

Sự khác nhau giữa chế độ chất lượng và chế độ kích thước mục tiêu là gì?

Chế độ chất lượng cho bạn một thanh trượt từ 0,1 đến 1,0 ánh xạ đến cài đặt lượng tử hóa của bộ mã hóa JPEG hoặc WebP — số thấp hơn nghĩa là file nhỏ hơn và nhiều artifact hơn có thể thấy. Chế độ kích thước mục tiêu đảo ngược vấn đề: bạn đặt tên kích thước tính bằng kilobyte và trang chia đôi giá trị chất lượng, mã hóa vài lần cho đến khi tìm thấy chất lượng cao nhất vẫn vừa dưới ngân sách của bạn. Kích thước mục tiêu tiện dụng khi giới hạn cứng quan trọng (ví dụ giới hạn tải lên 1 MB); chế độ chất lượng nhanh hơn và tốt hơn khi bạn chỉ muốn kết quả hình ảnh có thể đoán trước. PNG không mất dữ liệu, vì vậy không có chế độ nào áp dụng cho nó.

Điều này có xảy ra trên thiết bị của tôi không?

Có, hoàn toàn. Trang sử dụng Canvas API gốc của trình duyệt và Web File API để giải mã và mã hóa lại từng ảnh trong bộ nhớ. Không có dữ liệu ảnh nào được gửi đến server, không có tải lên tạm thời, và không có vòng lặp qua đám mây. Bạn có thể tự xác minh: mở DevTools, chuyển sang bảng Network, và chạy nén. Các yêu cầu gửi đi duy nhất bạn sẽ thấy là tải trang ban đầu và các cuộc gọi quảng cáo. Không có gì có hình dạng ảnh rời khỏi tab.

Tại sao nén PNG đôi khi hầu như không thu nhỏ nó?

PNG là định dạng không mất dữ liệu, vì vậy Canvas API không thể vứt bỏ chi tiết để làm nó nhỏ hơn — nó chỉ có thể đóng gói lại cùng những pixel. Đối với ảnh chụp, PNG đã lớn và việc mã hóa lại không mất dữ liệu tiết kiệm rất ít. Lợi ích thực sự đến từ việc chuyển đổi định dạng đầu ra sang JPEG hoặc WebP, sử dụng nén lossy phù hợp với ảnh chụp và thường nhỏ hơn 4 đến 10 lần. Giữ PNG chỉ khi bạn cần chất lượng không mất dữ liệu hoặc độ trong suốt; ngược lại, chọn JPEG cho ảnh hoặc WebP cho cân bằng kích thước-chất lượng tốt nhất.

Nên chọn định dạng nào?

Đối với ảnh chụp, WebP ở chất lượng 0,8 cung cấp cân bằng kích thước-chất lượng tốt nhất và được hỗ trợ bởi mọi trình duyệt đã phát hành từ năm 2021; JPEG là lựa chọn dự phòng toàn cầu an toàn khi đích đến cũ hơn hoặc nghiêm ngặt hơn. Chọn PNG chỉ khi bạn cần chất lượng không mất dữ liệu hoặc kênh alpha — tranh vẽ đường nét, ảnh chụp màn hình UI, logo có độ trong suốt. Nếu bạn tối ưu hóa tốc độ trang và đối tượng của bạn sử dụng trình duyệt hiện đại, WebP hầu như luôn là lựa chọn đúng; nếu bạn cung cấp cho CMS cũ hoặc pipeline in ấn từ chối WebP, hãy dùng JPEG.

Thả ảnh của bạn vào, chọn mức chất lượng hoặc kích thước mục tiêu, nén. Mọi thứ chạy trong tab của bạn. Không tải lên, không cần tài khoản, không chờ hàng đợi server.