這篇文章主要介紹“PNG圖片壓縮原理是什么”,在日常操作中,相信很多人在PNG圖片壓縮原理是什么問(wèn)題上存在疑惑,小編查閱了各式資料,整理出簡(jiǎn)單好用的操作方法,希望對(duì)大家解答”P(pán)NG圖片壓縮原理是什么”的疑惑有所幫助!接下來(lái),請(qǐng)跟著小編一起來(lái)學(xué)習(xí)吧!
“專業(yè)、務(wù)實(shí)、高效、創(chuàng)新、把客戶的事當(dāng)成自己的事”是我們每一個(gè)人一直以來(lái)堅(jiān)持追求的企業(yè)文化。 成都創(chuàng)新互聯(lián)是您可以信賴的網(wǎng)站建設(shè)服務(wù)商、專業(yè)的互聯(lián)網(wǎng)服務(wù)提供商! 專注于成都網(wǎng)站設(shè)計(jì)、做網(wǎng)站、軟件開(kāi)發(fā)、設(shè)計(jì)服務(wù)業(yè)務(wù)。我們始終堅(jiān)持以客戶需求為導(dǎo)向,結(jié)合用戶體驗(yàn)與視覺(jué)傳達(dá),提供有針對(duì)性的項(xiàng)目解決方案,提供專業(yè)性的建議,創(chuàng)新互聯(lián)建站將不斷地超越自我,追逐市場(chǎng),引領(lǐng)市場(chǎng)!
什么是PNG
PNG的全稱叫便攜式網(wǎng)絡(luò)圖型(Portable Network Graphics)是目前流行的網(wǎng)絡(luò)傳輸和展示的圖片格式,原因有如下幾點(diǎn):
無(wú)損壓縮:PNG圖片采取了基于LZ77派生算法對(duì)文件進(jìn)行壓縮,使得它壓縮比率更高,生成的文件體積更小,并且不損失數(shù)據(jù)。
體積?。核锰厥獾木幋a方法標(biāo)記重復(fù)出現(xiàn)的數(shù)據(jù),使得同樣格式的圖片,PNG圖片文件的體積更小。網(wǎng)絡(luò)通訊中因受帶寬制約,在保證圖片清晰、逼真的前提下,優(yōu)先選擇PNG格式的圖片。
支持透明效果:PNG支持對(duì)原圖像定義256個(gè)透明層次,使得圖像的邊緣能與任何背景平滑融合,這種功能是GIF和JPEG沒(méi)有的。
PNG類(lèi)型
PNG圖片主要有三個(gè)類(lèi)型,分別為 PNG 8/ PNG 24 / PNG 32。
PNG 8:PNG 8中的8,其實(shí)指的是8bits,相當(dāng)于用2^8(2的8次方)大小來(lái)存儲(chǔ)一張圖片的顏色種類(lèi),2^8等于256,也就是說(shuō)PNG 8能存儲(chǔ)256種顏色,一張圖片如果顏色種類(lèi)很少,將它設(shè)置成PNG 8得圖片類(lèi)型是非常適合的。
PNG 24:PNG 24中的24,相當(dāng)于3乘以8 等于 24,就是用三個(gè)8bits分別去表示 R(紅)、G(綠)、B(藍(lán))。R(0~255),G(0~255),B(0~255),可以表達(dá)256乘以256乘以256=16777216種顏色的圖片,這樣PNG 24就能比PNG 8表示色彩更豐富的圖片。但是所占用的空間相對(duì)就更大了。
PNG 32:PNG 32中的32,相當(dāng)于PNG 24 加上 8bits的透明顏色通道,就相當(dāng)于R(紅)、G(綠)、B(藍(lán))、A(透明)。R(0~255),G(0~255),B(0~255),A(0~255)。比PNG 24多了一個(gè)A(透明),也就是說(shuō)PNG 32能表示跟PNG 24一樣多的色彩,并且還支持256種透明的顏色,能表示更加豐富的圖片顏色類(lèi)型。
怎么說(shuō)呢,總的來(lái)說(shuō),PNG 8/ PNG 24 / PNG 32就相當(dāng)于我們屌絲心中,把女神分為三類(lèi):
一類(lèi)女神 = PNG 8:屌絲舔狗們見(jiàn)到這一類(lèi)女神,頓時(shí)會(huì)覺(jué)得心情愉悅、笑逐顏開(kāi),屌絲發(fā)黑的印堂逐漸舒展,確認(rèn)過(guò)眼神,是心動(dòng)的感覺(jué)。
二類(lèi)女神 = PNG 24:第二類(lèi)女神開(kāi)始厲害了,會(huì)給屌絲們一種菊花一緊、振聾發(fā)聵的心弦震撼,接觸多了第二類(lèi)女神能讓屌絲每天精神抖擻,延年益壽。
三類(lèi)女神 = PNG 32:在第三類(lèi)女神面前,所有的語(yǔ)言都顯得蒼白無(wú)力。超凡脫俗、天神下凡都不足以描摹她美色的二分之一。我曾經(jīng)只有在夢(mèng)里才見(jiàn)到過(guò)。
哎。。。我的初戀,看著她現(xiàn)在的照片,應(yīng)該是觸及PNG 24這一等級(jí)了。
PNG圖片數(shù)據(jù)結(jié)構(gòu)
PNG圖片的數(shù)據(jù)結(jié)構(gòu)其實(shí)跟http請(qǐng)求的結(jié)構(gòu)很像,都是一個(gè)數(shù)據(jù)頭,后面跟著很多的數(shù)據(jù)塊,如下圖所示:
如果你用vim的查看編碼模式打開(kāi)一張png圖片,會(huì)是下面這個(gè)樣子:
看到這一坨坨十六進(jìn)制編碼是不是感覺(jué)和女神的心思一樣晦澀難懂?
老弟 莫慌,講實(shí)話,如果撩妹紙有那一坨坨亂碼那么簡(jiǎn)單,哥哥我早就妻妾成群啦。
接下來(lái)我就一一講解這一堆十六進(jìn)制編碼的含義。
8950 4e47 0d0a 1a0a:這個(gè)是PNG圖片的頭,所有的PNG圖片的頭都是這一串編碼,圖片軟件通過(guò)這串編碼判定這個(gè)文件是不是PNG格式的圖片。
0000 000d:是iHDR數(shù)據(jù)塊的長(zhǎng)度,為13。
4948 4452:是數(shù)據(jù)塊的type,為IHDR,之后緊跟著是data。
0000 02bc:是圖片的寬度。
0000 03a5:是高度。
以此類(lèi)推,每一段十六進(jìn)制編碼就代表著一個(gè)特定的含義。下面其他的就不一一分析了,太多了,小伙伴們自己去查吧。
什么樣的PNG圖片更適合壓縮
常規(guī)的png圖片,顏色越單一,顏色值越少,壓縮率就越大,比如下面這張圖:
它僅僅由紅色和綠色構(gòu)成,如果用0代表紅色,用1代表綠色,那用數(shù)字表示這張圖就是下面這個(gè)樣子:
00000000000000000
00000000000000000
00000000000000000
1111111111111111111111111
1111111111111111111111111
1111111111111111111111111
我們可以看到,這張圖片是用了大量重復(fù)的數(shù)字,我們可以將重復(fù)的數(shù)字去掉,直接用數(shù)組形式的[0, 1]就可以直接表示出這張圖片了,僅僅用兩個(gè)數(shù)字,就能表示出一張很大的圖片,這樣就極大的壓縮了一張png圖片。
所以!顏色越單一,顏色值越少,顏色差異越小的png圖片,壓縮率就越大,體積就越小。
PNG的壓縮
PNG圖片的壓縮,分兩個(gè)階段:
預(yù)解析(Prediction):這個(gè)階段就是對(duì)png圖片進(jìn)行一個(gè)預(yù)處理,處理后讓它更方便后續(xù)的壓縮。說(shuō)白了,就是一個(gè)女神,在化妝前,會(huì)先打底,先涂乳液和精華,方便后續(xù)上妝、美白、眼影、打光等等。
壓縮(Compression):執(zhí)行Deflate壓縮,該算法結(jié)合了 LZ77 算法和 Huffman 算法對(duì)圖片進(jìn)行編碼。
預(yù)解析(Prediction)
png圖片用差分編碼(Delta encoding)對(duì)圖片進(jìn)行預(yù)處理,處理每一個(gè)的像素點(diǎn)中每條通道的值,差分編碼主要有幾種:
不過(guò)濾
X-A
X-B
X-(A+B)/2(又稱平均值)
Paeth推斷(這種比較復(fù)雜)
假設(shè),一張png圖片如下:
這張圖片是一個(gè)紅色逐漸增強(qiáng)的漸變色圖,它的紅色從左到右逐漸加強(qiáng),映射成數(shù)組的值為[1,2,3,4,5,6,7,8],使用X-A的差分編碼的話,那就是:
[2-1=1, 3-2=1, 4-3=1, 5-4=1, 6-5=1, 7-6=1, 8-7=1]
得到的結(jié)果為
[1,1,1,1,1,1,1]
[1,1,1,1,1,1,1]這個(gè)結(jié)果出現(xiàn)了大量的重復(fù)數(shù)字,這樣就非常適合進(jìn)行壓縮。
這就是為什么漸變色圖片、顏色值變化不大并且顏色單一的圖片更容易壓縮的原理。
差分編碼的目的,就是盡可能的將png圖片數(shù)據(jù)值轉(zhuǎn)換成一組重復(fù)的、低的值,這樣的值更容易被壓縮。
此外,還要注意的是,差分編碼處理的是每一個(gè)的像素點(diǎn)中每條顏色通道的值,R(紅)、G(綠)、B(藍(lán))、A(透明)四個(gè)顏色通道的值分別進(jìn)行處理。
壓縮(Compression)
壓縮階段會(huì)將預(yù)處理階段得到的結(jié)果進(jìn)行Deflate壓縮,它由 Huffman 編碼 和 LZ77壓縮構(gòu)成。
如前面所說(shuō),Deflate壓縮會(huì)標(biāo)記圖片所有的重復(fù)數(shù)據(jù),并記錄數(shù)據(jù)特征和結(jié)構(gòu),會(huì)得到一個(gè)壓縮比大的png圖片 編碼數(shù)據(jù)。
Deflate是一種壓縮數(shù)據(jù)流的算法. 任何需要流式壓縮的地方都可以用。
還有就是我們前面說(shuō)過(guò),一個(gè)png圖片,是由很多的數(shù)據(jù)塊構(gòu)成的,但是數(shù)據(jù)塊里面的一些信息其實(shí)是沒(méi)有用的,比如用Photoshop保存了一張png圖片,圖片里就會(huì)有一個(gè)區(qū)塊記錄“這張圖片是由photshop創(chuàng)建的”,很多類(lèi)似這些信息都是無(wú)用的,如果用photoshop的“導(dǎo)出web格式”就能去掉這些無(wú)用信息。導(dǎo)出web格式前后對(duì)比效果如下圖所示:
可以看到,導(dǎo)出web格式,去除了很多無(wú)用信息后,圖片明顯小了很多。
到此,關(guān)于“PNG圖片壓縮原理是什么”的學(xué)習(xí)就結(jié)束了,希望能夠解決大家的疑惑。理論與實(shí)踐的搭配能更好的幫助大家學(xué)習(xí),快去試試吧!若想繼續(xù)學(xué)習(xí)更多相關(guān)知識(shí),請(qǐng)繼續(xù)關(guān)注創(chuàng)新互聯(lián)網(wǎng)站,小編會(huì)繼續(xù)努力為大家?guī)?lái)更多實(shí)用的文章!
分享標(biāo)題:PNG圖片壓縮原理是什么
本文來(lái)源:http://chinadenli.net/article10/gicsgo.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供自適應(yīng)網(wǎng)站、用戶體驗(yàn)、網(wǎng)站收錄、營(yíng)銷(xiāo)型網(wǎng)站建設(shè)、手機(jī)網(wǎng)站建設(shè)、網(wǎng)站制作
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)