Tuesday, 1 May 2007

New Blogger (Beta): GIF, PNG uploads slow down your blog

DON'T upload GIF or PNG image files via the built-in Post Editor if you blog via the now feature complete fancy New Blogger, formerly known as Blogger Beta. It produces horrendously inflated thumbnails. Only JPG files are safe from the dreaded Blogger bloat!

If you upload a pic or photo to Blogger via the post editor, Blogger creates a thumbnail picture of your original, which is then displayed in your blog post. The thumbnail is meant to be a smaller version of the original, which people can click to see a copy of the original full size image file.

But oddly enough, New Blogger actually increases the file size of the thumbnail displayed on your blog, to bigger than the original file's size - and even bigger than the fullsize versions. Always with GIFs, often with PNGs. So don't save pics or photos in either of those file formats if you want to upload them to New Blogger, or it'll slow down the loading time horribly (and needlessly) for visitors to your blog.

With JPG or JPEG picture files though, it's fine - New Blogger doesn't seem to mess with those. Old Blogger ("Classic Blogger") did that randomly sometimes, on my blog at least (it produced smaller JPG thumbnails for some GIFs, left other GIFs exactly as is, turned some GIFs into PNGs of comparable filesize - whereas it would reduce a similar JPEG). But New Blogger always, always turns out bloated GIFs.

A test example, with a 420x300 GIF whose filesize was 72.6kb, produced a medium sized thumbnail of 400x280, which is fine, but the thumbnail's file size was - 201kb! Inflated to nearly triple the original file size.

PNG example. The large original was 52kb - the smaller thumbnail turned out to be 145kb! (That was in my last post. I've since swapped it for a JPG.)

To make matters worse, images from Picasa Web Albums (which is where New Blogger now stores pics uploaded via Blogger) don't seem to get cached - on some computers or browsers anyway. So when someone revisits a page with a PWA image, the browser has to request the image from the server and they have to download the image all over again. With multiple GIFs, it's compounded further - and lots of my posts have several GIF screenshots, which is one reason why posts from my blog were taking so long to come up.

With JPGs, the large size remains unchanged and it seems the thumbnails are being reduced to about 85% quality. A test image, a JPEG version of the same GIF file saved at 100%, had a file size of 89kb. After being uploaded through Blogger the large size stayed the same, and the thumbnail was downgraded to 15kb. So it seems Blogger is reducing JPGs properly.

I haven't had the chance to check if the same problem happens with images posted to New Blogger from Picasa direct, or with GIFs or PNGs hosted elsewhere which you hotlink to from Blogger.

But for now, until Team Blogger sort out the problem, if you're using New Blogger it's best not to upload pictures via the New Blogger post editor in GIF or PNG format. Change to JPGs and you might find your blog webpages' loading time speeding up instantly!

(This was discovered, as usual, by Kirk. Trust him to figure out what's wrong when something's going weird.)


Claudya said...

Thanks for this great tip, because i upload much images on my blog (all in jpg), anyway,the device is cool! Hugs...

Improbulus said...

Thanks for your comment Claudya, good job you only use JPG!