前言:該文收集了前輩們的一些關于圖片優化的技巧,在此收攏到一起,對于各個方法的優化原理做了一些研究,希望能給大家對于圖片優化這一塊起到拋磚引玉的作用。
騰訊財付通設計中心 Jia :提到圖片,我們不得不從位圖開始說起,位圖圖像(bitmap),也稱為點陣圖像或繪制圖像,是由稱作像素(圖片元素)的單個點組成的。這些點可以進行不同的排列和染色以構成一副圖片。當放大位圖時,可以看見賴以構成整個圖像的無數單個方塊。
常見的格式中JPG、PNG、GIF亦屬于位圖,所以它們的數據結構大致相同,只是每一種圖片格式都有不同的壓縮算法,不同的掃描方式,但是優化的方法都有一個共同點,都是圍繞著每個像素顏色值來下手,具體如何進行優化呢?
下面來給大家介紹一下圖片的一些基本原理和優化的方法:
1.JPG原理與優化
JPG是一種對彩色或灰階之類連續色調圖形作壓縮和解壓縮的標準.這個標準是由ISO/IEC JTC1/SC29 WG10所訂定。
壓縮算法為正、反離散余弦轉換,如下圖:
反離散余弦轉換即把整個流程反轉。
這里的8X8像素區塊是我們JPG優化方法的重點,在之后會涉及到取樣、區塊量化、掃描的步驟,然而取樣、區塊量化這兩個步驟將是導致圖像失真的過程,也是我們優化工作所涉及到核心部分。
取樣: