Improving Magento Speed by up to 50% by automatically optimizing images

Hi

I wanted to share some of the work we have been doing around improving Magento's performance by automatically optimizing images for visitors' browsers. We have rolled this into a plugin for Magento, which I hope will be useful. We have been able to reduce page load time on Magento by up to 50% in some cases for our customers.

Since images make up more than 60% of an average page weight- its an amazing opportunity to increase speed and save on bandwidth.

Attachment 1925

We do this by:
- Automatically serving WEBP Images to chrome browsers instead of JPEG ( saves about 30% of the size) or JPG-XR for internet explorer users)
- Allowing Magento admin to specify quality of images accross the site. A 10% drop in quality, will often not be noticeable to the users visually but increase speed a lot.
- Automatically Cacheing and serving the images transparently using a CDN
- Clearing out all the unused meta data not visible in images.

This is what we achieved for same page!
Attachment 1926

Case Study and Demo Video:
Here is a link to the case study and benchmarks I did using Magento Community with sample data:
bit.ly/magespeedy

Plugin Link
Link to the plugin on the connect store if you want to try it out on your site: bit.ly/connectMagento
Its Free and opensource, built using practices like Behat and DDD.


It would be great to hear your feedback on it and if you have any questions please ask away.

Cheers

well done!

Here is a great blog sport that can help you find best solution to speed up Magento site
http://www.magesolution.com/blog/optimize-magento-site/

Also take a look this tutorial :http://www.magesolution.com/blog/optimize-magento-site/

Thank you for your wonderful work, Grant:)

It was a pleasure to work on this case study with you!

The concept of sprite image is as follows “Rather than loading all the image files, you get to merge all these images and place them collectively under a single image. In spite of being in the same URL the location of these images can be distinguished from their background position. So there will be only one image file and when your website loads, the images will be retrieved separately from their background positions. By this way you get to reduce the image files effectively. To know more, Visit the link Magento Speed Optimization