影像與照片·影像轉換器和壓縮器
色度二次取樣：為什麼 JPEG 會模糊紅色文字和細彩色線
· 工作原理
影像格式 JPEG 影像品質
JPEG 和有損 WebP 以低於亮度的分辨率儲存顏色，這在照片中不可見，但在紅色文字中很明顯。這篇文章解釋了 4:2:0 子採樣、編碼器為何這樣做，以及當顏色邊緣很重要時如何選擇格式。
紅色標籤變得模糊，而黑色文字保持清晰——這一症狀直接指向色度子取樣
即使紅色標籤在螢幕截圖中都是清晰的向量，但它的顯示效果可能比相鄰的深色文字更柔和。此症狀值得研究，但它本身並不能辨識精確的色度子取樣模式。 ToolAcre 解碼原始碼，將像素繪製到畫布上，並向瀏覽器請求 JPEG 或 WebP 位元組；由此產生的邊緣是證據，而編碼器的私人決策則不是。
從一張在一個背景上包含窄紅色、藍色、灰色和黑色筆畫的受控圖片開始。保持其尺寸不變，匯出每個目標一次並以本機像素大小檢查下載。如果只有有損輸出塗抹飽和邊界，則表示格式選擇。如果每個輸出都是軟的，首先檢查是否發生了調整大小，因為計劃將任何更改的尺寸分類為重新採樣。
亮度和色度：將像素分為亮度和顏色 - YCbCr 變換以及編碼器將兩者分開的原因
此大綱描述了亮度和色度變換，但此儲存庫中沒有出現變換程式碼。該應用程式向瀏覽器編碼器提供解碼後的 RGBA 像素，並從不接收單獨的亮度或顏色平面。因此，它可以記錄實際的差異（有損輸出可能會丟棄可見細節），而無需假裝揭示瀏覽器的係數計算或內部顏色表示。
該邊界改變了缺陷報告的編寫方式。記錄來源 MIME 類型、目標 MIME 類型、品質、原始和輸出尺寸、瀏覽器以及顯示受影響邊緣的裁切。不要宣告特定通道已減半，除非編碼器檢查證明這一點。可以再現精確的觀察結果；借用的關於隱藏實現設定的解釋可能會讓維護者轉向他們沒有的控制項。
顏色細節損失是可觀察到的，但此存儲庫沒有實現或公開 YCbCr 轉換
熟悉的 4:4:4、4:2:2 和 4:2:0 標籤不是該介面中的控制項。 `encodeCanvas` 僅傳遞 MIME 類型，對於 JPEG 或 WebP，傳遞標準化品質值。面板和轉換計畫都不包含二次採樣欄位。將這些模式呈現為可選擇的部分將與發貨的產品相矛盾，因此有用的教訓是缺乏該選擇。
當需要顏色邊緣保真度時，請選擇可以檢查其結果的路徑，而不是從滑桿中假設一種模式。 PNG 是可用的無損編碼器，當尺寸保持固定時保持 alpha。 JPEG 和 ToolAcre 的 WebP 輸出在每種品質上都被明確描述為有損。這種由來源支援的區別足以選擇更安全的候選圖表，而無需發布不受支援的支援矩陣。
瀏覽器編碼器不公開 4:4:4、4:2:2 或 4:2:0 選擇器
照片將細節分佈在紋理、光線和不規則邊界上，因此顏色邊緣的微小變化可能不像單像素介面規則那麼明顯。這是一種檢查啟發式方法，而不是聲稱人類視覺遵循 ToolAcre 中編碼的比率。該應用程式不會計算感知相似性、對內容進行分類或證明查看者不會看到損壞。
使用代表性材料。對於充滿彩色類型的設計系統來說，單獨的肖像是一個糟糕的測試，而單獨的合成圖表對於照片庫來說是一個糟糕的代理。轉換器報告測量的位元組大小並提供第一個結果的前後預覽，但接受應包括以實際佈局開啟檔案。預覽縮放可以準確隱藏正在檢查的邊界損壞。
照片可以比圖形更好地隱藏色邊損失；這裡沒有斷言視覺模型
圖形在硬過渡中集中了意義：紅色警告下劃線、圖表中的藍色系列或白色的彩色文字。當相鄰樣本在有損編碼期間混合或舍入時，邊緣可能會出現滲色，即使其位置未改變。調整大小增加了另一種機制，因為 `drawImage` 在編碼之前以高平滑度重新繪製來源。
透過在第一次比較時保持尺寸不變來區分這些機制。如果 PNG 保持清晰，而 JPEG 和 WebP 軟化，則有損編碼階段是差異化因素。接下來重複進行有意的調整大小，以了解重新取樣會增加什麼。這種兩步驟實驗比一起改變品質、尺寸和格式更強大，因為每一輪中只有一個決定發生變化。
瀏覽器編碼器可以讓您控制什麼 - 品質數字但沒有子採樣開關，以及為什麼有損 WebP 始終是 4:2:0
ToolAcre 為瀏覽器提供了一個從 0.01 到 1（對於 JPEG 和 WebP）的品質編號。它不提供顏色取樣、轉換錶或編碼器工作的開關。這本工作手冊聲稱有損 WebP 始終是一種命名的子採樣模式，這超出了檢查的實現範圍，因此本文故意不重複它作為產品保證。
對隱藏編碼器選擇的實際回應不是尋找未記錄的複選框。比較實際輸出，保留來源，並在精確的彩色邊緣比較小的檔案更重要時選擇 PNG。如果生產管道需要指定的采樣模式，请使用其記錄的 API 公開它的編碼器；畫布便利 API 無法滿足它從不接受的契約。
此工具僅透過品質檢查；編碼器的子取樣策略仍然隱藏
建立一張 1200-by-800 測試圖，其中包含紅色和藍色細對角線、深色標籤、平滑的中性漸變和一個透明角。將其匯出而不調整大小為 PNG、JPEG 和 WebP。儲存庫無法預測位元組總數或確切的偽影，因此請寫下面板顯示的測量結果，而不是在測試計劃中插入承諾的百分比。
在 100% 處，將彩色筆畫與深色控制項進行比較，並檢查透明角是否倖存。 PNG 應通過支持的無损編碼器保留 alpha； JPEG 接收選定的遮罩，因為它無法存儲 Alpha； WebP 保留 alpha，但仍標記為有损。這三個可見的結果測試了不同的屬性，並避免將“較小”視為“更好”的同義詞。
要点：按內容選擇格式 — 當颜色邊缘必須保持清晰時，圖片轉換器和壓縮器如何让您匯出與 PNG 相同的圖片
格式選擇不能保證每個下游應用程式將如何渲染顏色、縮放影像或縮放影像以進行顯示。 ToolAcre 也不公開其輸出中的子取樣元資料或提供像素差異度量。這些遺漏意味著最終檢查屬於目標頁面、檔案或應用程序，而不僅僅是轉換面板內。
對於飽和文字和窄顏色規則，從無損候選開始，並透過直接檢查證明任何有損替換的合理性。影像轉換器和壓縮器使這種比較可以在一台裝置上重複：相同的來源、固定尺寸、三種輸出格式和測量的位元組。結果（而不是共享滑塊編號或假定的二次採樣模式）應該決定發布什麼。