reSmush.it image style optimizer

reSmush.it compresses images in size to improve their loading time (Gerd Altmann  |  pixabay.com)reSmush.it compresses images in size to improve their loading time (Gerd Altmann | pixabay.com)

reSmush.it is a free image optimization API. It compresses the size of your images, making them — and therefore your website — significantly faster to load. reSmush.it image style optimizer is a Drupal module that provides an image style effect with this capability.

Introduction

Image styles in Drupal are excellent to downsize your high quality original images to dimensions that are actually needed to show on various pages of your site. But even the most fittingly resized images are still heavier in terms of file size than they could be. There are many clever optimization techniques that can identify and filter out those parts of image files that have no influence on how the image looks to the human eye.

reSmush.it is a popular image optimization API (billions of images served) that seamlessly replaced the excellent but now defunct Yahoo Smush.it web service. On the background the web service uses well-established algorithms such as PNGQuant, JPEGOptim, and OptiPNG. reSmush.it optimizes all image formats supported by Drupal (PNG, JPG, GIF) and even several more. The service is free up to 5MB per file, which is perfectly OK for most cases, since optimization happens after the image is resized.

There are other optimization systems, such as Kraken, TinyPNG, ImageOptim, but most of them are subscription-based and not free. There are infrastructure solutions as well, such as Google Pagespeed module.

Advantages

The main advantages of the reSmush.it module include:

There are a few other Drupal modules that use reSmush.it as their image optimization backend but they tend to only optimize on image upload and not per image style (e.g. ImageAPI Optimize).

Installation

Settings

The configuration page at admin/config/media/resmushit provides some optional settings, such as the possibility to show debug information in Watchdog, configuration of a timeout for the web service, and the maximum size of the operational log.

Dashboard

reSmush.it image style optimizer provides a luxurious dashboard page at admin/config/media/resmushit/dashboard full of relevant additional data from the module, such as the image styles that are being optimized, a list of recently optimized images (with path, status, size before and after, etc.), or a count of successful vs all image optimization operations.

How to use

Go to a page that displays an image using an image style where you included the reSmush.it effect. If the derivative image did not exits, it will be created now (if you want to be sure it gets created anew, clear image caches, e.g. using drush image-flush). Then go to the module's dashboard where you should see that image listed among the recently optimized ones, complete with the size reduction percentage!

Problems

Nobody's perfect, and the strife for perfection is even harder for those doing it for free. If you suspect reSmush.it did not optimize your image, go to the dashboard to check it up. If you see an error, it's possible the web service was briefly unavailable, or that it was slower than limits defined by this module and timed out. One thing you can do is to increase the timeout limit on the settings page.

For more documentation and live examples, see the demo page.

Known major integrators

Collaboration

Let's make this module better together! Ideas, patches and inspired co-maintainers welcome!

Demo

Tomáš Fülöpp
Sint-Agatha-Berchem, Belgium
July 4, 2017, July 8, 2017
Tomáš Fülöpp (2012)

Parents of this entryParents

Siblings of this entrySiblings

Social media linksSocials

Related linksRelated links

Tagsdrupalphpmoduleoptimizeapiimageperformancecompressionproject
LanguageENGLISH Content typeARTICLELast updateOCTOBER 20, 2018 AT 01:46:40 UTC