Boost image loading performance with Imagilicious

Apr 1, 2011

It is a well known fact that pages with many images load more slowly than simple HTML pages. Not only are image files heavier than text files, they also require additional HTTP requests.

In an attempt to solve both of these performance problems, I have created a new Drupal module: Imagilicious. Imagilicious replaces tags that reference an external image to be loaded with a 100% HTML rendering of the same image. Unlike immature technologies like the <canvas> element, Immagilicious uses tables, which guarantee compatibility even with the most outdated browsers.

Here is a sample of the output (no <img> is used, this is a table), using Wunderkraut's logo as a source image:

Oh, and since some of you asked, no, I didn't do it by hand.