Image Optimizer

What is it?

Image Optimizer is an Add-on for Local that helps you optimize the images on your site by more efficiently compressing those images and removing unnecessary data.

This is important because a site that uses un-optimized images will:

  1. Take longer to download the content, especially on slower networks
  2. Score lower in SEO ranking
  3. Frustrate your users with slower performance and excessive use of bandwidth

Where can I get it?

The easiest way to get the Image Optimizer is to install it from the Add-ons tab within Local.

You can also manually download the add-on from the Image Optimizer Add-ons page.

If you’re curious about how this add-on was built, or want to manually install the add-on from the source code take a look at the repository on Github.

How do I use it?

Once the Add-on has been installed, you can find Image Optimizer under the “Tools” tab for the site you’d like to work on. The general workflow for using Image Optimizer looks like this:

  1. Scan for images to be optimized
  2. Select which images to process
  3. Optimize!

How are the images optimized?

Ok, great, I’m saving space, but what’s really happening to the media used on my site?

At this time, Image Optimizer is focused on a few things to get your images in the best place they can be.

Here’s a shortlist of things that Image Optimizer is doing:

  1. Only jpeg images are optimized. Other media like pnggifsvg, or .mp4 are not handled at this time, though optimizing additional file types is planned.
  2. Only jpeg‘s that are contained within the wp-content/uploads folder will be scanned and optimized. Any images that are contained within another folder like the theme, or any plugin folders will not be optimized.
  3. If enabled in the Add-on settings, file metadata will be removed. The kind of metadata that is removed relates to things like camera settings, EXIF metadata, and other potentially identifying data. This helps decrease file size as well as remove potentially sensitive, identifying data.
  4. To ensure that there isn’t any loss of quality, only “Lossless” compression is available. Future versions of Image Optimizer will include the ability to optimize with “Lossy” compression.

note

Settings can be adjusted in “Preferences > Addons > Image Optimizer”

Image Optimizer Settings page.

Image Metadata

One of the optimizations that Image Optimizer performs is to strip the metadata from a file.

Oftentimes digital photos will contain all sorts of information related to the image which is useful when editing the image in tools like Photoshop. When publishing images to the web, this sort of information isn’t useful, and in some cases can leak private data to the world.

If you’re curious about the exact kinds of data that are being stripped, then I would recommend using a tool like exiftool to compare the original image with the optimized one. As an example, here’s an image that was taken with a Google Pixel and run through the Image Optimizer tool.

A screenshot comparing the optimized image on the left with the original image on the right using exiftool and vimdiff.

What about the original images?

All original images are saved to the backups folder within the Local site which can be reached by right-clicking on the site in Local and selecting “Reveal in Finder”

The original images are backed up to the backups folder within the Local site.

You can always review or restore the original images by copying them back to their original location within the wp-content/uploads folder.

The original image is backed up within the backups folder of the site and can be restored at any time using the file manager.

What if something goes wrong?

The best way to zero in on what has gone wrong with the optimization process is to review what messages are in the Local Log.

To access the Log, click on “Help > Reveal Local’s Log” or see this help doc for more information.

Once you are viewing the log, you should see Image Optimizer entries that look something like this, and should give you a general direction on what things to investigate next.

Image Optimizer entries in the Local Log.

If you are still having issues with Image Optimizer and want additional help, create a new topic in the Community Forums with as much detail about what you are seeing as possible.