Introducing WebberZone Image Optimizer: WebP and AVIF Without an Account

Most WordPress image optimization plugins ask for something first: an account, an API key, a monthly image allowance, or your media library uploaded to somebody else’s server for encoding. It is a workable business model, but it’s also a dependency. When the pricing changes or the company is acquired, you are on the wrong side of the deal.

I wanted the conversion to happen on the same server that already resizes every upload. WebberZone Image Optimizer converts your media library to WebP and/or AVIF locally and serves each visitor the smallest file their browser can read. Images are typically 30 to 50% smaller with no visible difference.

There are no wp_remote_* calls in the plugin, as the repositoryOpens in a new window shows. Nothing leaves your server, and nothing can stop working because somebody else changed their terms.

Image Optimizer v1

Your server almost certainly already supports this

WordPress cannot crop or resize an upload without Imagick or GD, so every working install has one of them, and both have written WebP for years.

AVIF is newer. It needs PHP 8.1 or later with GD built against libavif, or Imagick with an AVIF delegate. Plenty of hosts have it, plenty do not.

You do not have to guess. A registered delegate is not the same thing as a working encoder, so rather than trusting Imagick::queryFormats(), activation encodes a bundled 64×64 test image with each driver and format pair and caches what came back. The settings screen marks any format your server cannot produce.

Your originals are never modified

Each optimized copy is written next to the original with the new extension appended, so photo.jpg gains photo.jpg.webp. Nothing is overwritten, replaced, resized, or re-saved.

Appending rather than replacing is deliberate. If logo.jpg and logo.png sit in the same folder, replacing the extension gives both the same sidecar, and delivery can no longer tell which original it belongs to. Uglier, and correct.

Deactivate the plugin and your site serves originals again immediately. No URL breaks. The Media library shows what was converted and what was skipped.

Delivery that survives a CDN

Images are wrapped in a <picture> element, so the browser picks the format.

The common alternative is to vary the response on the Accept header, which returns different bytes for one URL. Any cache in front of that which ignores Vary hands a WebP file to a browser that cannot display it, and page caches and CDNs do this more often than you would like. A <picture> element has no such failure mode. Every visitor gets identical HTML, and the choice happens after the cache. I have compared this with the other conversion plugins separately.

Responsive images are handled properly. Every candidate in an image’s srcset maps to its optimized copy with the width descriptors preserved exactly. If one size in the set has no optimized copy, the whole image falls back to the original rather than letting the browser request a file that does not exist. That applies to thumbnail grids like the ones Contextual Related Posts renders, so leave Image sizes to convert unchecked.

Images referenced from a stylesheet never appear in markup the plugin can rewrite, so the Delivery tab generates ready-to-paste Apache and nginx rules with the Vary: Accept header they need. Only files inside your own uploads directory are converted, so images still pointing at another domain after an import are left alone.

Bulk conversion that finishes

The bulk screen runs through a database-backed queue, one batch at a time. Close the tab, and nothing is lost. A background worker keeps going, and reopening the screen resumes where it stopped. Failures are retried and then listed with the reason.

On a small library, you will not notice any of this. On fifty thousand attachments, it is the difference between a run that finishes and one that dies on a timeout.

Images per batch defaults to 10 and can be lowered if your server times out. A memory guard skips an oversized image rather than crashing the batch. Queue images on first view catches whatever the bulk run missed: an image seen on the front end but not yet converted is queued, never encoded during the page render, so no visitor waits.

Quality you control

WebP quality defaults to 82 and AVIF to 50. Those numbers are not comparable. AVIF at 50 looks about the same as WebP at 82 while producing a noticeably smaller file.

Encoder effort runs from 0 to 6 and defaults to 6. Conversion happens once, and the result is served many times, so the highest setting is usually right. Lower it if bulk runs time out. The settings reference covers the rest.

Strip metadata removes EXIF, GPS, and embedded thumbnails while keeping the color profile, so colors do not shift. Lossless for PNG sources is off by default. Turn it on for logos, screenshots, and line art, and off for photographs saved as PNG. Any copy no smaller than its source is discarded, governed by Minimum saving (%).

For developers

Five WP-CLI commands cover the workflow:

wp wzio status                        # what this server can encode, and progress
wp wzio convert <id>... [--force]     # convert now
wp wzio queue [--force]               # fill the background queue
wp wzio run [--batch=<n>]             # work through the queue
wp wzio clean [<id>...]               # delete generated files

Filters cover the parts worth changing: wzio_conversion_args for quality, formats and thresholds, wzio_attachment_files for which files an attachment converts, wzio_is_excluded for per-file exclusion, wzio_delivery_enabled to turn rewriting off for a request, and wzio_driver_classes to register your own encoder backend. The developer referenceOpens in a new window lists the rest.

The plugin is multisite-aware, with per-site queues and tables created automatically for new sites.

Getting started

  1. Install and activate from WordPress.orgOpens in a new window.
  2. Go to Media > Image Optimizer and choose the formats you want to generate under Formats. WebP is selected by default.
  3. Visit Media > Bulk Optimize and press Start.
  4. Check a page in your browser devtools. You should see a <picture> element wrapping the images.

Requires WordPress 6.6 and PHP 7.4. The full documentation is live, and it runs alongside my other plugins.

Leave a Reply

Your email address will not be published. Required fields are marked *