PNG soubory jsou považovány za příliš objemné. Loga, grafika, screenshoty, všechno to váží víc, než by muselo, a přitom vypadá na webu stejně. Proč jsou PNG soubory tak velké a co se s nimi děje při kompresi s pomocí online PNG optimalizátoru? Odpověď je překvapivě zajímavá a pochopení tohoto principu vám pomůže pracovat s obrázky chytřeji.
PNG a jeho filosofie
PNG vznikl v devadesátých letech jako přímá odpověď na omezení tehdejších formátů. Jeho tvůrci si dali jeden zásadní cíl: komprese nesmí obrázek poškodit. Žádná ztráta dat, žádné artefakty, žádné rozmazané hrany. Co do souboru vejde, to z něj musí vyjít přesně tak, jak tam šlo.
Tomuto přístupu se říká bezeztrátová komprese – a je to vlastnost, která PNG odlišuje od JPEG nejzásadněji. JPEG při každém uložení něco zahodí. PNG nezahodí nikdy nic.
Zní to jako samá pozitiva. Proč jsou tedy PNG soubory tak velké?
Co se v souboru skutečně skrývá?
Než pochopíte, jak komprese funguje, pomůže vědět, co PNG soubor vlastně obsahuje.
Každý digitální obrázek je na nejnižší úrovni mřížka pixelů. Každý pixel má přiřazenu barevnou hodnotu – ve formátu RGBA to jsou čtyři čísla: červená, zelená, modrá a průhlednost. U obrázku s rozlišením 1000 × 1000 pixelů to znamená milion pixelů, každý se čtyřmi hodnotami. Nekomprimovaná data z takového obrázku mají klidně desítky megabajtů.
PNG tato surová data bere a prohání je dvěma po sobě jdoucími kroky. První krok se jmenuje filtrování, druhý komprese. Každý z nich hraje jinou roli a dohromady tvoří základ toho, proč PNG funguje tak, jak funguje.
Filtrování a příprava dat před kompresí
Filtrování je krok, o kterém většina lidí neví a přitom je pro výslednou velikost souboru zcela zásadní.
Před samotnou kompresí PNG analyzuje každý řádek pixelů a ptá se: jak mohu tato data zapsat tak, aby v nich bylo co nejvíce opakujících se vzorců? Čím více vzorců, tím lépe funguje komprese.
PNG nabízí několik typů filtrů. Nejjednodušší žádnou transformaci nedělá a data nechá tak, jak jsou. Subtraktivní filtr místo absolutních barevných hodnot zapíše rozdíly mezi sousedními pixely, a pokud jsou sousední pixely podobné barvy, tyto rozdíly jsou malá čísla blízká nule. Malá čísla opakující se v řadě za sebou jsou pro kompresi ideální.
Inteligentní PNG enkodér testuje různé filtry pro různé řádky a vybírá ten, který přinese nejlepší výsledek. Tento krok stojí čas při ukládání, ale výrazně snižuje výslednou velikost souboru.
DEFLATE je srdce PNG komprese
Druhým krokem je samotná komprese. PNG k ní používá algoritmus zvaný DEFLATE, což je stejný algoritmus který znáte z formátu ZIP. Je to bezeztrátová komprese, která hledá v datech opakující se sekvence a nahrazuje je kratšími zástupnými kódy.
Představte si, že máte v textu frázi „modrá obloha“ a ta se opakuje stokrát. DEFLATE řekne: tuto frázi nahradím číslem 1 a uložím ji pouze jednou. Kdekoliv v datech bylo původní slovní spojení, bude teď jen číslo 1. Výsledný soubor je menší a při rozbalení se vše vrátí přesně do původního stavu.
U obrázků funguje stejný princip. Plochy jednotné barvy, například bílé pozadí loga, nebo jednobarevná plocha infografiky, jsou pro DEFLATE ideální vstup. Tisíce pixelů stejné barvy za sebou se zkomprimují na zlomek původní velikosti.
Naopak fotografie s přirozenými přechody barev jsou pro DEFLATE velmi těžký materiál. Každý pixel se liší od sousedního, opakující se vzorce jsou vzácné a komprese přináší malý efekt. Proto jsou PNG fotografie tak velké, formát je na tento typ obsahu jednoduše nevhodný.
Proč loga a grafika v PNG fungují lépe než fotografie?
Teď dává smysl, proč je PNG přirozenou volbou pro určité typy obrázků a špatnou volbou pro jiné.
Logo firmy zpravidla obsahuje velké plochy jedné barvy, ostré hrany a omezené množství různých barevných odstínů. DEFLATE si s ním poradí výborně. Redundance v datech je totiž obrovská a komprese přináší dramatické zmenšení. Výsledek je malý soubor s dokonale ostrými hranami a přesnou barevností.
Fotografie krajiny nebo portrét jsou přesným opakem. Milion pixelů, každý trochu jiný, a minimum opakujících se vzorců. PNG komprese přináší minimální úsporu a výsledný soubor je obrovský. Na takový obsah patří JPEG nebo WebP.
Průhlednost je přitom oblast, kde PNG nemá skutečného soupeře. Například průhledné pozadí loga, grafiku s vyříznutým tvarem nebo překrývající se vrstvy designu PNG zvládá přirozeně díky alfa kanálu. JPEG průhlednost nepodporuje vůbec. WebP ji sice zvládá, ale nástroje pro export nejsou vždy tak přímočaré.
Jak online PNG optimalizátory dosahují dalšího zmenšení?
Pokud je PNG komprese bezeztrátová, jak mohou online nástroje soubor ještě zmenšit?
Část odpovědi leží v optimalizaci samotného DEFLATE algoritmu. Standardní PNG enkodéry – třeba ten v Photoshopu nebo Figmě – nepoužívají vždy nejagresivnější možné nastavení komprese, protože větší komprese znamená delší dobu zpracování. Specializované nástroje jako Zopfli nebo libpng s upraveným nastavením dokážou stejný obsah zkomprimovat lépe, aniž by cokoliv ztratily.
Druhá část odpovědi je v metadatech. PNG soubory mohou nést velké množství skrytých informací, třeba informace o barevném profilu, GPS souřadnice, komentáře, informace o softwaru, ve kterém byl soubor vytvořen. Tato metadata jsou pro zobrazení na webu naprosto zbytečná a jejich odstranění sníží velikost souboru bez jakéhokoliv vizuálního dopadu.
Třetí možností je redukce barevné palety. PNG-24 ukládá každý pixel s plnou barevnou hloubkou až 16 milionů barev. Pokud ale obrázek reálně obsahuje jen sto různých barevných odstínů, přechod na PNG-8 s indexovanou paletou dramaticky sníží velikost souboru. Nástroje jako TinyPNG nebo PNGQuant tuto analýzu provádějí automaticky a výsledek je vizuálně těžko odlišitelný od originálu.
Kdy PNG přestat používat?
PNG má jasné limity a překračovat je je zbytečně nákladné. Fotografie na webu nemají v PNG co dělat – JPEG nebo WebP odvede lepší práci při zlomku datové velikosti. Ani rozsáhlé ilustrace s přirozené přechody barev nejsou pro PNG vhodné.
WebP dnes zvládá jak bezztrátový, tak ztrátový režim, podporuje průhlednost a při srovnatelné kvalitě váží méně než PNG. Pro nové weby je přechod na WebP logickým krokem a většina moderních prohlížečů ho plně podporuje.
