Media Optimization Configuration

Currently available in beta

Media Optimization is currently available in beta, which means some of the features, specifications, and details provided herein are subject to change. We recommend checking back regularly for the most up-to-date information and viewing our roadmap in regard to the general availability release.

These docs are a WIP (work in progress). More detailed documentation will follow soon.

System Check

System Check does not provide configuration options, but rather provides details and diagnostics on the resize and conversion libraries installed, such as whether certain features are supported.

Image Optimization Settings

These configuration options allow you to enable the overall functionality of Media Optimization, select engines and outputs used, and enable logging.

Core Settings

The module ships with defaults that work well for most stores. Enable optimization and select your desired output formats to get started.

The Retina setting controls whether the module generates 2x and 3x resolution variants for high-density displays. This improves image quality on modern devices but increases storage requirements and initial processing time.

Format Selection

WebP provides good compression with broad browser support. AVIF offers better compression but requires newer browsers. Consider your browser support requirements when selecting formats.

Automatic Image Replacement Settings

These configuration options allow you to enable/disable automatic image replacement, set the mode used for replacing both HTML (e.g. <img>) and CSS (e.g. background-image), the input formats to target and the final formats to output to.

Replacement Modes

The simple replacement mode maintains HTML structure while updating image URLs, making it the safest option for most sites. Picture mode provides better optimization but changes the DOM structure, which may affect JavaScript that expects specific elements.

For CSS, simple mode replaces URLs with optimized versions while image-set mode generates modern image-set declarations.

GD|Imagick Resize|Conversion Engine Settings

These configuration options allow for setting engine-specific quality, compression, encoding speed settings and more.

For detailed information about engine selection, requirements, and when to use each engine, see the Engines documentation.