Speed up your website by compressing images

21 Jan 2010

Webpagetest.org is a great tool to learn how the web browser works and how you can improve your website loading time (you should use it if you aren’t using it already).

Today after running a report I’ve seen that we had a large image on the home page that can be compressed to minimize loading time. Smaller images means faster pages, faster pages means happy users :).

To compress PNG images on Linux I’ve found two alternatives:

  • OptiPNG - OptiPNG is a PNG optimizer that recompresses image files to a smaller size, without losing any information. This program also converts external formats (BMP, GIF, PNM and TIFF) to optimized PNG, and performs PNG integrity checks and corrections.
  • Pngcrush - Pngcrush is an optimizer for PNG (Portable Network Graphics) files. It can be run from a commandline in an MSDOS window, or from a UNIX or LINUX commandline.

    Its main purpose is to reduce the size of the PNG IDAT datastream by trying various compression levels an PNG filter methods. It also can be used to remove unwanted ancillary chunks, or to add certain chunks including gAMA, tRNS, iCCP, and textual chunks.

Installation

OptiPNG rpm package is available in EPEL repository, and Pngcrush rpm for CentOS/RHEL can be found Dag’s repository:

$ sudo yum --enablerepo=epel --enablerepo=rpmforge install optipng pngcrush

Usage

I’ve achieved 20% - 24% file size reduction after PNG compression, example usage:

$ optipng -o7 example.png
$ pngcrush -brute -e ".compressed.png"  *png

More on the subject: