Tiles tar plats! JPG vs PNG

I veckan som gått har jag genererat en hel del tiles till ett projekt och kan konstatera att tiles tar mycket plats.

Tiles är ju i förväg renderade ”kartor” för alla tänkta zoom nivåer. Det är altså inte en karta som visas i olika skala, utan en genererad bild för varje nivå man vill visa, vilket gör att alla bilder lagras flera gånger. Lite som när man väljer att bygga pyramider för rasterdata.

Högsta upplösningen för ett område tar kanske 16 MB. Pyramider i ytterligare fyra nivåer lägger teoretiskt till 8 + 4 + 2 + 1 MB data, så slutresultatet blir 31 MB. I princip en fördubbling.

I många geoservrar så görs denna extra rendering ”on-the-fly” och lagras i en cache på servern för att snabba upp visningen nästa gång. Moderna datorer har dessutom beräkningskapacitet för att användaren inte skall uppleva renderingen som direkt gränssättande.

Har man ingen geoserver, så har man däremot inte så mycket val och då blir tiles ett enkelt alternativ för exempelvis en Leaflet eller OpenLayers karta.

Jag har använt PNG för mina tiles, men de stora datamängderna har fått mig att fundera på vad man kan tjäna på att använda JPG i stället. Detta inlägg blir ett litet experiment för att försöka klargöra skillnaderna i några specifika fall, så häng med!

Jag kommer inte att använda enbart kartor för mina prov, utan även några väldigt enkla bilder som jag exporterar ut i PNG och JPG, med lite olika inställningar. Det blir inte heltäckande men jag försöker välja typfall som bör påvisa eventuella skillnader i olika situationer.

Jag börjar med den rena grafikbilden till vänster.

Filstorlekar:
PNG: 5,3 kB
JPG 100%: 10,9 kB
JPG 70%: 5,8 kB
JPG 50%: 5,2 kB

Här blir faktiskt JPG filen med full kvalité dubbelt så stor! För att komma ned i samma storlek som för PNG så behöver kvalitén sättas till mellan 50% och 70%. Kvalitén i bilden blir omedelbart sämre när detta görs, så för denna typ av bilder så finns det inga som helst vinster med JPG.

Bilden ovan är en förstoring av JPG med 70% kvalité.

För kartbilden blir resultaten liknande, men ändå mer åt det håll jag förväntat.

Filstorlekar:
PNG: 83,9 kB
JPG 100%: 121,1 kB
JPG 70%: 25,3 kB
JPG 50%: 18,7 kB

Även nu är JPG filen i högsta kvalité större än PNG, men med lite extra komprimering så blir filerna drastiskt mindre.

I bilden ovan finns en inzoomning av, från vänster till höger, PNG, JPG 100%, JPG 70% och JPG 50%.

Med tanke på den drastiska minskningen av filstorlek så skulle jag nu överväga att använda JPG. Däremot så är redan 70% för dålig för att jag skall vara nöjd. JPG 90% nästan halverar storleken jämfört med PNG, men även där är komprimeringen påtaglig. Kanske 95%… Då är jag nere på en nivå som jag kan acceptera i bildkvalitén, men då har jag ”bara” sparat 25% i lagringsvolym.

Flygbilden då! Nu är faktiskt JPG bilden redan i bästa kvalité nästan hälften så stor. Kanske hittat en nisch för JPG nu.

Filstorlekar:
PNG: 102,2 kB
JPG 100%: 55,2 kB
JPG 70%: 9,6 kB
JPG 50%: 7,0 kB

Nu blir det betydligt svårare att se skillnader i bilderna, men det går faktiskt redan vid 70%.

I bilden ovan är det som tidigare PNG, JPG 100%, JPG 70% och JPG 50%. Klicka på bilderna för att se dem i förstoring.

Jag provar även att skapa en bild med 90% kvalité och då är det i princip omöjligt att se någon skillnad mot PNG, men filstorleken är då endast 17,7 kB!

Slutsatser

Jag kommer att fortsätta med PNG i mina tiles för allt utom flyg och satellitbilder. Dessa är såpass ”kaotiska” från början att den komprimering som JPG kan erbjuda inte påverkar resultatet nämnvärt, så länge kvalitén kan hållas någorlunda hög.

Jag kommer dock inte att använda JPG komprimering hårdare än runt 70% i något sammanhang. Jag kommer i alla fall att undvika det så länge det inte finns något annat val. Vinsterna med minskad lagringsvolym blir helt enkelt för kostsam.

Ser du framför dig att du kommer att öppna och spara om bilder så bör du helt undvika JPG. Komprimering multipliceras nämligen så bilder blir gradvis sämre och sämre. För en slutprodukt kan det dock fungera bra.