Hình ảnh & hình ảnh · Trình chuyển đổi & nén hình ảnh
Lấy mẫu con sắc độ: tại sao JPEG làm mờ văn bản màu đỏ và các đường màu mỏng
· Cách thức hoạt động
image-formats jpeg image-quality
JPEG và mất mát WebP lưu trữ màu ở độ phân giải thấp hơn độ sáng, màu này không thể nhìn thấy trong ảnh và hiển thị rõ ràng trên văn bản màu đỏ. Bài đăng này giải thích 4:2:0 lấy mẫu phụ, lý do bộ mã hóa thực hiện việc đó và cách chọn định dạng khi các cạnh màu đóng vai trò quan trọng.
Nhãn màu đỏ bị mờ trong khi văn bản màu đen vẫn sắc nét — triệu chứng chỉ thẳng vào việc lấy mẫu phụ sắc độ
Nhãn màu đỏ có thể nổi lên nhẹ nhàng hơn so với văn bản tối màu lân cận ngay cả khi cả hai đều bắt đầu dưới dạng vectơ sắc nét trong ảnh chụp màn hình. Triệu chứng đó đáng để nghiên cứu, nhưng bản thân nó không xác định được chế độ lấy mẫu sắc độ chính xác. ToolAcre giải mã nguồn, vẽ pixel vào khung vẽ và yêu cầu trình duyệt JPEG hoặc WebP byte; lợi ích thu được là bằng chứng, trong khi các quyết định riêng tư của bộ mã hóa thì không.
Bắt đầu với một hình ảnh được kiểm soát có chứa các nét hẹp màu đỏ, xanh lam, xám và đen trên một nền. Giữ nguyên kích thước của nó, xuất từng mục tiêu một lần và kiểm tra các lượt tải xuống ở kích thước pixel gốc. Nếu chỉ có các đầu ra bị suy hao làm mờ các ranh giới bão hòa thì việc lựa chọn định dạng sẽ có liên quan. Nếu mọi đầu ra đều mềm, trước tiên hãy kiểm tra xem việc thay đổi kích thước có xảy ra hay không vì kế hoạch sẽ phân loại mọi kích thước đã thay đổi là lấy mẫu lại.
Luma và sắc độ: chia một pixel thành độ sáng và màu sắc - biến đổi YCbCr và lý do bộ mã hóa tách hai phần này
Bản phác thảo mô tả các phép biến đổi độ sáng và sắc độ, tuy nhiên không có mã biến đổi nào xuất hiện trong kho lưu trữ này. Ứng dụng cung cấp RGBA pixel đã giải mã cho bộ mã hóa trình duyệt và không bao giờ nhận được các mặt phẳng màu hoặc độ sáng riêng biệt. Do đó, nó có thể ghi lại sự khác biệt thực tế—đầu ra bị mất có thể loại bỏ chi tiết hiển thị—mà không giả vờ tiết lộ các phép tính hệ số của trình duyệt hoặc biểu thị màu bên trong.
Ranh giới đó thay đổi cách viết báo cáo lỗi. Ghi lại loại MIME nguồn, loại MIME mục tiêu, chất lượng, kích thước gốc và đầu ra, trình duyệt và phần cắt hiển thị cạnh bị ảnh hưởng. Không tuyên bố rằng một kênh cụ thể đã bị giảm một nửa trừ khi quá trình kiểm tra bộ mã hóa chứng minh được điều đó. Một quan sát chính xác có thể được sao chép lại; một lời giải thích vay mượn về các cài đặt triển khai ẩn có thể khiến người bảo trì hướng tới một biện pháp kiểm soát mà họ không có.
Có thể quan sát thấy hiện tượng mất chi tiết màu sắc, nhưng kho lưu trữ này không triển khai hoặc hiển thị biến đổi YCbCr
Các nhãn 4:4:4, 4:2:2 và 4:2:0 quen thuộc không phải là các điều khiển trong giao diện này. `encodeCanvas` chỉ chuyển loại MIME và đối với JPEG hoặc WebP, giá trị chất lượng được chuẩn hóa. Cả bảng điều khiển và kế hoạch chuyển đổi đều không có trường lấy mẫu con. Phần trình bày các chế độ đó là có thể lựa chọn sẽ mâu thuẫn với sản phẩm được vận chuyển, vì vậy bài học hữu ích là không có lựa chọn đó.
Khi yêu cầu phải có độ trung thực của cạnh màu, hãy chọn đường dẫn mà bạn có thể kiểm tra kết quả thay vì giả sử một chế độ từ thanh trượt. PNG là bộ mã hóa không mất dữ liệu có sẵn và giữ alpha khi kích thước không đổi. Đầu ra JPEG và ToolAcre của WebP được mô tả rõ ràng là suy hao ở mọi chất lượng. Sự khác biệt dựa trên nguồn đó đủ để chọn một ứng cử viên an toàn hơn cho sơ đồ mà không xuất bản ma trận hỗ trợ không được hỗ trợ.
Bộ mã hóa trình duyệt không hiển thị bộ chọn 4:4:4, 4:2:2 hoặc 4:2:0
Các bức ảnh phân phối chi tiết trên các kết cấu, ánh sáng và các ranh giới không đều, do đó, một thay đổi nhỏ về cạnh màu có thể ít dễ thấy hơn so với trên quy tắc giao diện một pixel. Đây là phương pháp phỏng đoán kiểm tra chứ không phải khẳng định rằng tầm nhìn của con người tuân theo tỷ lệ được mã hóa trong ToolAcre. Ứng dụng không tính toán mức độ tương tự về nhận thức, phân loại nội dung hoặc chứng nhận rằng người xem sẽ không nhìn thấy được thiệt hại.
Sử dụng tài liệu đại diện. Chỉ riêng một bức chân dung là một thử nghiệm kém đối với một hệ thống thiết kế có đầy đủ các loại màu và chỉ riêng một biểu đồ tổng hợp là một đại diện kém cho một thư viện ảnh. Trình chuyển đổi báo cáo kích thước byte đã đo và cung cấp bản xem trước trước và sau cho kết quả đầu tiên, nhưng việc chấp nhận phải bao gồm việc mở tệp trong bố cục thực tế. Việc chia tỷ lệ xem trước có thể che giấu chính xác thiệt hại ranh giới đang được xem xét.
Hình ảnh có thể che giấu hiện tượng mất viền màu tốt hơn đồ họa; không có mô hình tầm nhìn nào được khẳng định ở đây
Đồ họa tập trung ý nghĩa trong các chuyển tiếp khó: gạch chân cảnh báo màu đỏ, chuỗi màu xanh lam trong biểu đồ hoặc văn bản màu trên nền trắng. Khi các mẫu lân cận được trộn hoặc làm tròn trong quá trình mã hóa bị mất, cạnh có thể bị tràn ra mặc dù vị trí của nó không thay đổi. Việc thay đổi kích thước sẽ thêm một cơ chế khác vì `drawImage` vẽ lại nguồn với độ mịn cao trước khi mã hóa.
Tách các cơ chế đó bằng cách giữ kích thước không đổi cho lần so sánh đầu tiên. Nếu PNG vẫn sắc nét trong khi JPEG và WebP mềm đi thì giai đoạn mã hóa bị mất chính là điểm khác biệt. Tiếp theo, lặp lại với việc thay đổi kích thước có chủ ý để tìm hiểu xem việc lấy mẫu lại sẽ bổ sung những gì. Thử nghiệm hai bước này mạnh hơn việc thay đổi chất lượng, kích thước và định dạng cùng nhau vì chỉ có một quyết định được đưa ra trong mỗi vòng.
Bộ mã hóa trình duyệt cho phép bạn kiểm soát những gì — một số chất lượng nhưng không có chuyển đổi lấy mẫu phụ và tại sao WebP mất dữ liệu luôn là 4:2:0
ToolAcre cung cấp cho trình duyệt số chất lượng được giới hạn từ 0.01 đến 1 cho JPEG và WebP. Nó không cung cấp công tắc để lấy mẫu màu, chuyển đổi bảng hoặc nỗ lực mã hóa. Tuyên bố của sổ làm việc rằng mất mát WebP luôn là một chế độ lấy mẫu con được đặt tên nằm ngoài quá trình triển khai được kiểm tra, vì vậy bài viết này cố tình không lặp lại điều đó như một sự đảm bảo cho sản phẩm.
Phản ứng thực tế đối với lựa chọn bộ mã hóa ẩn không phải là tìm kiếm hộp kiểm không có giấy tờ. So sánh kết quả đầu ra thực tế, bảo toàn nguồn và chọn PNG khi các cạnh có màu chính xác quan trọng hơn một tệp nhỏ hơn. Nếu quy trình sản xuất yêu cầu chế độ lấy mẫu được chỉ định, hãy sử dụng bộ mã hóa có tài liệu API hiển thị chế độ đó; tiện ích canvas API không thể đáp ứng hợp đồng mà nó không bao giờ chấp nhận.
Công cụ này chỉ đạt chất lượng; chính sách lấy mẫu con của bộ mã hóa vẫn bị ẩn
Xây dựng biểu đồ thử nghiệm 1200-by-800 với các đường chéo mỏng màu đỏ và xanh lam, nhãn tối, dải màu trung tính mượt mà và một góc trong suốt. Xuất tệp mà không đổi kích thước thành PNG, JPEG và WebP. Kho lưu trữ không thể dự đoán tổng số byte hoặc các thành phần giả chính xác, vì vậy hãy ghi lại các kết quả đo được hiển thị bởi bảng điều khiển thay vì chèn tỷ lệ phần trăm đã hứa vào kế hoạch kiểm tra.
Ở mức 100 phần trăm, hãy so sánh các nét màu với các điều khiển tối và kiểm tra xem góc trong suốt có tồn tại hay không. PNG phải giữ lại alpha thông qua bộ mã hóa không mất dữ liệu được hỗ trợ; JPEG nhận được mờ đã chọn vì nó không thể lưu trữ alpha; WebP giữ lại alpha nhưng vẫn bị đánh dấu là mất dữ liệu. Ba kết quả có thể nhìn thấy này kiểm tra các thuộc tính riêng biệt và tránh coi “nhỏ hơn” là từ đồng nghĩa với “tốt hơn”.
Bài học rút ra: chọn định dạng theo nội dung — cách Trình chuyển đổi & Trình nén Hình ảnh cho phép bạn xuất cùng một hình ảnh dưới dạng PNG khi các cạnh màu phải luôn sắc nét
Lựa chọn định dạng không thể đảm bảo mọi ứng dụng tiếp theo sẽ hiển thị màu sắc, thu phóng hình ảnh hoặc chia tỷ lệ để hiển thị như thế nào. ToolAcre cũng không hiển thị siêu dữ liệu lấy mẫu phụ từ kết quả đầu ra của nó hoặc cung cấp chỉ số chênh lệch pixel. Những thiếu sót đó có nghĩa là bước kiểm tra cuối cùng thuộc về trang đích, tài liệu hoặc ứng dụng thay vì chỉ nằm trong bảng chuyển đổi.
Đối với văn bản bão hòa và các quy tắc có màu hẹp, hãy bắt đầu với ứng viên không mất dữ liệu và biện minh cho bất kỳ sự thay thế mất mát nào bằng cách kiểm tra trực tiếp. Trình chuyển đổi & nén hình ảnh giúp việc so sánh đó có thể lặp lại trên một thiết bị: cùng một nguồn, kích thước cố định, ba định dạng đầu ra và số byte được đo. Kết quả—không phải số thanh trượt chung hoặc chế độ lấy mẫu con giả định—sẽ quyết định những gì sẽ được gửi.