Online image optimization, or taiming robots
Yesterday we covered some ways to reduce images size on you blog (it’s a part of our general optimization strategy). We saved about 24% of the whole page size, or about 140 Kb. It was a great advantage, but what we else do here?
Using some combinations of tools and additional processing for JPEG images can save us more. So let’s try to review more ways to speed up our WordPress blog.
Smush.it
Smush.it (now actually developer.yahoo.com/yslow/smushit/) is the most popular service (and included into YSlow, which is our main performance measurement tool) to optimize images. We have uploaded there the first image from the current post to see actual performance.
You can upload files there and get them optimized. Not very useful because you need to do this with every file (and we already have hundreds of files to optimize on our small blog). But this tool can be used for free and it seems without any limitations.
Punypng
Punypng (www.gracepointafterfive.com/punypng) seems to be the most advanced tool but has a number of limitations (advanced image optimization process is very CPU intensive). Here we have used the same image as for smush.it, but:
You can see for this image punypng gives additional 20% of savings. Authors talked about 25% average additional achievements in their benchmarks post. Seems to be the truth.
So if you are going to get extreme optimization for your images you can use punypng.
WordPress plugins
It seems this task (large amount of images to be optimized) is a bit boring and can be automated simply. And there is a WP smush.it plugin. It going to optimize all posts’ images and can be used for custom optimization. But it seems to be a bit broken (and this was impossible to get it working for this website).
Also there is another plugin – WEBO Site SpeedUp – which seems to have a lot of and even more optimization features. But we are going only to optimize all our images somehow with a little efforts. There is also some tools included into this plugin – Static Gzip and Image Optimization. The last one uses only smush.it but authors are going to include support for punypng. Let’s try it.
After WEBO Site SpeedUp installation / activation go to Settings page and look for Image Optimization link on Control Panel dashboard. Then just Find Files, wait a bit and press Compress Files. Wow.
Plugin has gone through all images (as you see there more than 700 in all folders inside WordPress installation) and has optimized them through smush.it interface API. Cool. But to get it working properly please check writing rights for all images (the main folder wp-content/uploads with posts’ images is writable by default, but theme directories maybe should be altered).
Also WEBO Site SpeedUp creates backup version of files and uses them to check if images have been changed or not (this reduced amount of work next time). So you can use this tool time to time to get your WordPress website in a good trim.
After all actions we have saved about 300 Kb out of 4000 Kb totally). But how much have we cut our home page down?
Additional 43 Kb in CSS images (compare with the previous one, and about nothing with common HTML images as far as we have smushed them earlier and there was created one more post since yesterday). So it adds additional 10% in our optimization piggy.
Conclusion
Images size is very, very important. As you can see from the last chart (after all our actions) images still occupy 80% of load speed. So they influence a lot, but we have reduced their size significantly. Advantages now are 54% = 20% from GZIP + 24% from image optimizarion + 10% from advanced image optimization. It almost the last actions we can perform to reduce page size and we are going to reduce a number of HTTP requests, the second enemy of fast websites. We will start with simple caching and see what we will gain after this.
So in the next posts we will cover client side (and it seems server side too because of increasing server delay – now about 700 ms to serve www.speedingupwebsite.com page). Stay on the line.
NO RESPONSE TO Online image optimization, or taiming robots