From d119ff711d46fcea37ceb052f228f22aedaac95c Mon Sep 17 00:00:00 2001 From: Felix Arntz Date: Wed, 7 Sep 2022 21:43:28 +0000 Subject: [PATCH] Media: Generate WebP only for certain registered image sizes. The existing filter `image_editor_output_format` receives an additional parameter `$size_name` which is populated whenever it controls the output format for a specific registered image size to create. Otherwise, it remains empty. In order to achieve this, a low level change has been added in bringing a new `$size_name` class property to the `WP_Image_Editor` base class, which is introduced in a backward compatible way that will not cause conflicts with custom implementations. This parameter is then used in new logic inside the `wp_default_image_output_mapping()` callback function for the filter, controlling whether `image/jpeg` should map to `image/webp` output or not. By default, this is enabled for all WordPress core image sizes by default, and this list can be modified using a new `wp_image_sizes_with_additional_mime_type_support` filter, e.g. to remove core sizes or add custom sizes. The customization per image size may be further enhanced by providing a more declarative API via a new parameter on the `add_image_size()` function. Props eugenemanuilov, flixos90, adamsilverstein, joegrainger. Fixes #56526. See #55443, #56288. git-svn-id: https://develop.svn.wordpress.org/trunk@54097 602fd350-edb4-49c9-b593-d223f7449a82 --- src/wp-admin/includes/image.php | 3 + src/wp-includes/class-wp-image-editor-gd.php | 21 +++-- .../class-wp-image-editor-imagick.php | 27 +++++-- src/wp-includes/class-wp-image-editor.php | 37 +++++++-- src/wp-includes/default-filters.php | 2 +- src/wp-includes/functions.php | 2 +- src/wp-includes/media.php | 34 ++++++++- tests/phpunit/tests/media.php | 76 ++++++++++++++++++- 8 files changed, 177 insertions(+), 25 deletions(-) diff --git a/src/wp-admin/includes/image.php b/src/wp-admin/includes/image.php index f937bdc2ff53d..44c9e2f46daca 100644 --- a/src/wp-admin/includes/image.php +++ b/src/wp-admin/includes/image.php @@ -451,6 +451,9 @@ function _wp_make_subsizes( $new_sizes, $file, $image_meta, $attachment_id ) { if ( method_exists( $editor, 'make_subsize' ) ) { foreach ( $new_sizes as $new_size_name => $new_size_data ) { + // Include size name in the data. + $new_size_data['name'] = $new_size_name; + $new_size_meta = $editor->make_subsize( $new_size_data ); if ( is_wp_error( $new_size_meta ) ) { diff --git a/src/wp-includes/class-wp-image-editor-gd.php b/src/wp-includes/class-wp-image-editor-gd.php index 03525ce9431e3..b329f768abb74 100644 --- a/src/wp-includes/class-wp-image-editor-gd.php +++ b/src/wp-includes/class-wp-image-editor-gd.php @@ -227,7 +227,7 @@ protected function _resize( $max_w, $max_h, $crop = false ) { * @since 3.5.0 * * @param array $sizes { - * An array of image size data arrays. + * Associative array of image size names and their data. * * Either a height or width must be provided. * If one of the two is set to null, the resize will @@ -247,6 +247,9 @@ public function multi_resize( $sizes ) { $metadata = array(); foreach ( $sizes as $size => $size_data ) { + // Include size name in the data. + $size_data['name'] = $size; + $meta = $this->make_subsize( $size_data ); if ( ! is_wp_error( $meta ) ) { @@ -261,13 +264,15 @@ public function multi_resize( $sizes ) { * Create an image sub-size and return the image meta data value for it. * * @since 5.3.0 + * @since 6.1.0 The $sizes parameter may now include a $name key for each entry. * * @param array $size_data { * Array of size data. * - * @type int $width The maximum width in pixels. - * @type int $height The maximum height in pixels. - * @type bool $crop Whether to crop the image to exact dimensions. + * @type int $width The maximum width in pixels. + * @type int $height The maximum height in pixels. + * @type bool $crop Whether to crop the image to exact dimensions. + * @type string $name Image size name. * } * @return array|WP_Error The image data array for inclusion in the `sizes` array in the image meta, * WP_Error object on error. @@ -277,7 +282,8 @@ public function make_subsize( $size_data ) { return new WP_Error( 'image_subsize_create_error', __( 'Cannot resize the image. Both width and height are not set.' ) ); } - $orig_size = $this->size; + $orig_size = $this->size; + $orig_size_name = $this->size_name; if ( ! isset( $size_data['width'] ) ) { $size_data['width'] = null; @@ -291,6 +297,10 @@ public function make_subsize( $size_data ) { $size_data['crop'] = false; } + if ( isset( $size_data['name'] ) ) { + $this->update_size_name( $size_data['name'] ); + } + $resized = $this->_resize( $size_data['width'], $size_data['height'], $size_data['crop'] ); if ( is_wp_error( $resized ) ) { @@ -301,6 +311,7 @@ public function make_subsize( $size_data ) { } $this->size = $orig_size; + $this->size_name = $orig_size_name; if ( ! is_wp_error( $saved ) ) { unset( $saved['path'] ); diff --git a/src/wp-includes/class-wp-image-editor-imagick.php b/src/wp-includes/class-wp-image-editor-imagick.php index f41338723350a..7ff6b67071570 100644 --- a/src/wp-includes/class-wp-image-editor-imagick.php +++ b/src/wp-includes/class-wp-image-editor-imagick.php @@ -438,7 +438,7 @@ protected function thumbnail_image( $dst_w, $dst_h, $filter_name = 'FILTER_TRIAN * @since 3.5.0 * * @param array $sizes { - * An array of image size data arrays. + * Associative array of image size names and their data. * * Either a height or width must be provided. * If one of the two is set to null, the resize will @@ -458,6 +458,9 @@ public function multi_resize( $sizes ) { $metadata = array(); foreach ( $sizes as $size => $size_data ) { + // Include size name in the data. + $size_data['name'] = $size; + $meta = $this->make_subsize( $size_data ); if ( ! is_wp_error( $meta ) ) { @@ -472,13 +475,15 @@ public function multi_resize( $sizes ) { * Create an image sub-size and return the image meta data value for it. * * @since 5.3.0 + * @since 6.1.0 The $sizes parameter may now include a $name key for each entry. * * @param array $size_data { * Array of size data. * - * @type int $width The maximum width in pixels. - * @type int $height The maximum height in pixels. - * @type bool $crop Whether to crop the image to exact dimensions. + * @type int $width The maximum width in pixels. + * @type int $height The maximum height in pixels. + * @type bool $crop Whether to crop the image to exact dimensions. + * @type string $name Image size name. * } * @return array|WP_Error The image data array for inclusion in the `sizes` array in the image meta, * WP_Error object on error. @@ -488,8 +493,9 @@ public function make_subsize( $size_data ) { return new WP_Error( 'image_subsize_create_error', __( 'Cannot resize the image. Both width and height are not set.' ) ); } - $orig_size = $this->size; - $orig_image = $this->image->getImage(); + $orig_size = $this->size; + $orig_size_name = $this->size_name; + $orig_image = $this->image->getImage(); if ( ! isset( $size_data['width'] ) ) { $size_data['width'] = null; @@ -503,6 +509,10 @@ public function make_subsize( $size_data ) { $size_data['crop'] = false; } + if ( isset( $size_data['name'] ) ) { + $this->update_size_name( $size_data['name'] ); + } + $resized = $this->resize( $size_data['width'], $size_data['height'], $size_data['crop'] ); if ( is_wp_error( $resized ) ) { @@ -515,8 +525,9 @@ public function make_subsize( $size_data ) { $this->image = null; } - $this->size = $orig_size; - $this->image = $orig_image; + $this->size = $orig_size; + $this->size_name = $orig_size_name; + $this->image = $orig_image; if ( ! is_wp_error( $saved ) ) { unset( $saved['path'] ); diff --git a/src/wp-includes/class-wp-image-editor.php b/src/wp-includes/class-wp-image-editor.php index 15e4aa8d6e0cf..db94fc7dfe937 100644 --- a/src/wp-includes/class-wp-image-editor.php +++ b/src/wp-includes/class-wp-image-editor.php @@ -14,6 +14,7 @@ abstract class WP_Image_Editor { protected $file = null; protected $size = null; + protected $size_name = ''; protected $mime_type = null; protected $output_mime_type = null; protected $default_mime_type = 'image/jpeg'; @@ -117,7 +118,7 @@ abstract public function resize( $max_w, $max_h, $crop = false ); * @abstract * * @param array $sizes { - * An array of image size arrays. Default sizes are 'small', 'medium', 'large'. + * Associative array of image size names and their data. Default sizes are 'small', 'medium', 'large'. * * @type array ...$0 { * @type int $width Image width. @@ -185,7 +186,7 @@ abstract public function stream( $mime_type = null ); * * @since 3.5.0 * - * @return int[] { + * @return array { * Dimensions of the image. * * @type int $width The image width. @@ -201,9 +202,9 @@ public function get_size() { * * @since 3.5.0 * - * @param int $width - * @param int $height - * @return true + * @param int $width The image width. + * @param int $height The image height. + * @return true True on success, false on failure. */ protected function update_size( $width = null, $height = null ) { $this->size = array( @@ -213,6 +214,28 @@ protected function update_size( $width = null, $height = null ) { return true; } + /** + * Gets the current image size name. + * + * @since 6.1.0 + * + * @return string Image size name, or empty string if none set. + */ + public function get_size_name() { + return $this->size_name; + } + + /** + * Sets the current image size name. + * + * @since 6.1.0 + * + * @param string $size_name The image size name. + */ + protected function update_size_name( $size_name ) { + $this->size_name = (string) $size_name; + } + /** * Gets the Image Compression quality on a 1-100% scale. * @@ -364,6 +387,7 @@ protected function get_output_format( $filename = null, $mime_type = null ) { * @see WP_Image_Editor::get_output_format() * * @since 5.8.0 + * @since 6.1.0 The $size_name parameter was added. * * @param string[] $output_format { * An array of mime type mappings. Maps a source mime type to a new @@ -373,8 +397,9 @@ protected function get_output_format( $filename = null, $mime_type = null ) { * } * @param string $filename Path to the image. * @param string $mime_type The source image mime type. + * @param string $size_name The image size name to create, or empty string if not set. */ - $output_format = apply_filters( 'image_editor_output_format', array(), $filename, $mime_type ); + $output_format = apply_filters( 'image_editor_output_format', array(), $filename, $mime_type, $this->size_name ); if ( isset( $output_format[ $mime_type ] ) && $this->supports_mime_type( $output_format[ $mime_type ] ) diff --git a/src/wp-includes/default-filters.php b/src/wp-includes/default-filters.php index ad9cef6691840..bf76a5d5e1f67 100644 --- a/src/wp-includes/default-filters.php +++ b/src/wp-includes/default-filters.php @@ -632,7 +632,7 @@ add_filter( 'image_send_to_editor', 'image_add_caption', 20, 8 ); add_filter( 'media_send_to_editor', 'image_media_send_to_editor', 10, 3 ); -add_filter( 'image_editor_output_format', 'wp_default_image_output_mapping' ); +add_filter( 'image_editor_output_format', 'wp_default_image_output_mapping', 10, 4 ); // Embeds. add_action( 'rest_api_init', 'wp_oembed_register_route' ); diff --git a/src/wp-includes/functions.php b/src/wp-includes/functions.php index f5b58315af1c1..946853c361b73 100644 --- a/src/wp-includes/functions.php +++ b/src/wp-includes/functions.php @@ -2690,7 +2690,7 @@ function wp_unique_filename( $dir, $filename, $unique_filename_callback = null ) */ if ( $is_image ) { /** This filter is documented in wp-includes/class-wp-image-editor.php */ - $output_formats = apply_filters( 'image_editor_output_format', array(), $_dir . $filename, $mime_type ); + $output_formats = apply_filters( 'image_editor_output_format', array(), $_dir . $filename, $mime_type, '' ); $alt_types = array(); if ( ! empty( $output_formats[ $mime_type ] ) ) { diff --git a/src/wp-includes/media.php b/src/wp-includes/media.php index 5de60501c3d6f..caf8d247f5f11 100644 --- a/src/wp-includes/media.php +++ b/src/wp-includes/media.php @@ -3912,9 +3912,39 @@ function _wp_image_editor_choose( $args = array() ) { * @since 6.1.0 * * @param array $output_mapping Map of mime type to output format. - * @retun array The adjusted default output mapping. + * @param string $filename Path to the image. + * @param string $mime_type The source image mime type. + * @param string $size_name Optional. The image size name to create, or empty string if not set. Default empty string. + * @return array The adjusted default output mapping. */ -function wp_default_image_output_mapping( $output_mapping ) { +function wp_default_image_output_mapping( $output_mapping, $filename, $mime_type, $size_name = '' ) { + // If size name is specified, check whether the size supports additional MIME types like WebP. + if ( $size_name ) { + // Include only the core sizes that do not rely on add_image_size(). Additional image sizes are opt-in. + $enabled_sizes = array( + 'thumbnail' => true, + 'medium' => true, + 'medium_large' => true, + 'large' => true, + 'post-thumbnail' => true, + ); + + /** + * Filters the sizes that support secondary mime type output. Developers can use this + * to control the generation of additional mime type sub-sized images. + * + * @since 6.1.0 + * + * @param array $enabled_sizes Map of size names and whether they support secondary mime type output. + */ + $enabled_sizes = apply_filters( 'wp_image_sizes_with_additional_mime_type_support', $enabled_sizes ); + + // Bail early if the size does not support additional MIME types. + if ( empty( $enabled_sizes[ $size_name ] ) ) { + return $output_mapping; + } + } + $output_mapping['image/jpeg'] = 'image/webp'; return $output_mapping; } diff --git a/tests/phpunit/tests/media.php b/tests/phpunit/tests/media.php index 1388e6c210e2b..fc03d2b654a7e 100644 --- a/tests/phpunit/tests/media.php +++ b/tests/phpunit/tests/media.php @@ -3626,7 +3626,7 @@ private function reset_omit_loading_attr_filter() { * @ticket 55443 */ public function test_wp_default_image_output_mapping() { - $mapping = wp_default_image_output_mapping( array() ); + $mapping = wp_default_image_output_mapping( array(), 'test.jpg', 'image/jpeg', '' ); $this->assertSame( array( 'image/jpeg' => 'image/webp' ), $mapping ); } @@ -3637,7 +3637,7 @@ public function test_wp_default_image_output_mapping() { */ public function test_wp_default_image_output_mapping_existing() { $mapping = array( 'mime/png' => 'mime/webp' ); - $mapping = wp_default_image_output_mapping( $mapping ); + $mapping = wp_default_image_output_mapping( $mapping, 'test.jpg', 'image/jpeg', '' ); $this->assertSame( array( 'mime/png' => 'mime/webp', @@ -3672,6 +3672,78 @@ public function test_wp_image_editor_default_output_maps_to_webp() { $this->assertSame( 'canola-100x75.jpg', $saved['file'] ); } } + + /** + * @ticket 56526 + * @dataProvider data_wp_default_image_output_mapping_size_filter + */ + public function test_wp_default_image_output_mapping_size_filter( $size_name, $filter_callback, $expects_webp ) { + remove_all_filters( 'wp_image_sizes_with_additional_mime_type_support' ); + if ( $filter_callback ) { + add_filter( 'wp_image_sizes_with_additional_mime_type_support', $filter_callback ); + } + + $mapping = wp_default_image_output_mapping( array(), 'test.jpg', 'image/jpeg', $size_name ); + if ( $expects_webp ) { + $this->assertSame( array( 'image/jpeg' => 'image/webp' ), $mapping ); + } else { + $this->assertSame( array(), $mapping ); + } + } + + public function data_wp_default_image_output_mapping_size_filter() { + return array( + 'default size thumbnail' => array( + 'thumbnail', + null, + true, + ), + 'default size medium' => array( + 'medium', + null, + true, + ), + 'default size medium_large' => array( + 'medium_large', + null, + true, + ), + 'default size large' => array( + 'large', + null, + true, + ), + 'default size unset' => array( + 'medium', + function( $enabled_sizes ) { + unset( $enabled_sizes['medium'] ); + return $enabled_sizes; + }, + false, + ), + 'default size set to false' => array( + 'medium', + function( $enabled_sizes ) { + $enabled_sizes['medium'] = false; + return $enabled_sizes; + }, + false, + ), + 'custom size' => array( + 'custom', + null, + false, + ), + 'custom size opted in' => array( + 'custom', + function( $enabled_sizes ) { + $enabled_sizes['custom'] = true; + return $enabled_sizes; + }, + true, + ), + ); + } } /**