If you have a blog or a website with a lot of content sometimes the images can take a toll on the load time of the pages. There are a number of steps you can take to speed things up. If you analyze the loading of your website you might notice that the images take up a huge part of the load time. Let’s take a look at how you can compress your .png images to improve on this figure.
We’ll use the tool pngcrush for this purpose. pngcrush is a free and open source command line tool that, as the name suggests, compresses PNG images. Take a look at the projects website for detailed information on how to use it. We will cover the basics in this article.
Most modern distributions of Linux such as Fedora and Ubuntu have pngcrush available directly in their default repositories. So, to install it on you Ubuntu computer execute the following command:
# sudo apt-get install pngcrush
On Fedora do the following:
# yum install pngcrush
pngcrush optimizes a PNG graphics file by reducing the size of the files IDAT chunk. The process is not simple. The great thing about pngcrush is that the authors of the tool have simplified things for you. They ship it with a great option – brute. When you use this option you effectively tell pngcrush to try and use the most suitable method to compress the image at hand. There are about 114 different filters that can be used, so this option is mighty useful. Here’s how you would use it to compress an image:
# pngcrush -brute -e “.compressed.png” image01.png
The two options used here are -brute which I just explained, and -e. The second option tells pngcrush what extension to add the the filenames. So after the process of crushing is complete the compressed version of the file image01.png will be called image01.compressed.png. you can change the extension if you like.
You can also slightly modify the above command to compress several PNG files in a directory. Execute the following command:
# pngcrush -brute -d “/var/www/html/website/images/” *.png
The above command uses a new option, -d. This option tells pngcrush where to place the compressed image files after the compression is complete. The above command will compress all the PNG file in the current directory and place them in /var/www/html/website/images/.
I strongly suggest that you read up more about this tool and its options on the projects website. There are a lot of options that might help you speed up the process of compression or do a better job of it. Put the new images into your website and watch your pages load faster.