Image quality and next-gen formats

By default, the VIP File System automatically converts and serves images located in a site’s /uploads/ directory as next-gen formats (including *.webp files) to compatible browsers.

Only browsers that have webp in their Accept header are compatible with *.webp files. Requests for *.jpg, *.png, or *.gif in compatible browsers will be served a *.webp format of the image file in the response. As a result, uploading *.webp files is not necessary, nor is it necessary to explicitly reference them in application code.

In addition, a *.webp file that was uploaded to a WordPress site will be automatically converted and served in *.jpg format to a browser that does not have webp in the Accept header. 

Limitation

Images larger than 10 MB will not be transformed to a *.webp file if the request URL for the file does not include any image transformation parameters. Additionally, images larger than 200 MB will not be transformed even if image transformations parameters are explicitly included. In both of these cases, the file in its original format will be returned instead.

Image quality and file formats

The effectiveness of the quality parameter on an image file is dependent on its image file format.

• Image file formats such as PNG and GIF have lossless compression which prevents the file from being further compressed and protects the visual quality of the image.
• JPGs have lossy compression which allows the file to be further compressed but compromises the visual quality of the image as a result.
• The more modern WebP and AVIF file formats can be either lossless or lossy.

The quality parameter is only effective when applied to a lossy image file format and when combined with other transformation parameters.

Override the default quality parameter value

The default values for the quality parameter that are applied to image files by type:

• JPEG 89%
• PNG 80%
• WebP 80%

The default value for quality can be overridden with the vip_go_image_resize_pre_args filter. This filter should be added to a plugin in client-mu-plugins/ so that it loads as early as possible, but the filter can also be located in plugins/ or themes/.

This code example demonstrates how to override the default quality parameter value for all images with 75 (75%):

function my_image_quality_filter( $args ) {
	$args['quality'] = 75;
	return $args;
}
add_filter( 'vip_go_image_resize_pre_args', 'my_image_quality_filter', 999 );