Empirical Responsive Images

Description

Empirical Responsive Images helps WordPress sites discover the image widths they actually render on real devices. It records aggregate front-end observations, registers matching WordPress image sizes, regenerates missing thumbnails, generates responsive variants for local theme/plugin asset images, and can create WebP and AVIF sidecar files when the server image editor supports those formats.

Features:

• Administrator-only front-end observer measures rendered image width, height, viewport width, DPR, attachment ID, and local asset source URL.
• Observations are stored as aggregate size data in WordPress options.
• Observed width candidates are registered through add_image_size().
• Admin batch tool regenerates image thumbnails and observed local asset variants.
• Optional WP-CLI regeneration command.
• WebP and AVIF sidecars are generated when supported by the active image editor.
• WordPress attachment images and local asset images can be wrapped in <picture> with AVIF/WebP sources and original fallback markup.
• Pages are kept out of page cache until a no-cache observation run confirms that known image sizes are already represented in srcset output.
• No external service calls.

Privacy

The observer runs only for logged-in users who can manage site options. Requests require WordPress REST authentication and a valid REST nonce. It stores aggregate rendered image data and canonical page paths only; query strings and raw IP addresses are not persisted.

By default, settings, observations, and generated asset variants are retained when the plugin is uninstalled. Site administrators can explicitly enable deletion under Tools > Responsive Images before uninstalling.

Cache compatibility

Before a page is confirmed stable, the plugin sends WordPress and HTTP cache bypass signals:

• DONOTCACHEPAGE
• Cache-Control: no-store, no-cache, must-revalidate, max-age=0
• CDN-Cache-Control: no-store
• Cloudflare-CDN-Cache-Control: no-store
• Surrogate-Control: no-store
• X-LiteSpeed-Cache-Control: no-cache

It also disables LiteSpeed page optimization and lazy-loading constants during those warming requests so the measured image slots match the real rendered layout.

The observer script is marked with optimizer bypass attributes including data-cfasync="false", data-no-optimize="1", data-no-defer="1", data-no-minify="1", and data-pagespeed-no-defer="1". Its REST configuration is also duplicated into data-empirical-responsive-images-* attributes so it can still run when an optimizer delays inline scripts.

WP-CLI

List observed sizes:

wp empirical-responsive-images sizes

Regenerate thumbnails and modern sidecars:

wp empirical-responsive-images regenerate --batch-size=10

Force rebuild:

wp empirical-responsive-images regenerate --force