Changeset 53751 for trunk/src/wp-includes/media.php

Timestamp:

07/21/2022 06:01:01 PM (3 years ago)

Author:

adamsilverstein

Message:

Media: enable generating multiple mime types for image uploads; specifically WebP versions for JPEG images by default.

This changeset adds the capability for core media uploads to generate sub sized images in more than a single mime type. The output formats for each mime type can be controlled through a filter. WebP is used as an additional output format for JPEG images by default to improve front end performance.

When generating additional mime types, only images which are smaller than the respective original are retained. By default, additional mime type images are only generated for the built-in core image sizes and any custom sizes that have opted in.

Image meta is updated with a new 'sources' array containing file details for each mime type. Each image size in the 'sizes' array also gets a new 'sources' array that contains the image file details for each mime type.

This change also increases image upload retries to accommodate additional image sizes. It also adds a $mime_type parameter to the wp_get_missing_image_subsizes function and filter.

This change adds three new filters to enable full control of secondary mime image generation and output:

• A new filter wp_image_sizes_with_additional_mime_type_support that filters the sizes that support secondary mime type output. Developers can use this to control the output of additional mime type sub-sized images on a per size basis.
• A new filter wp_upload_image_mime_transforms that filters the output mime types for a given input mime type. Developers can use this to control generation of additional mime types for a given input mime type or even override the original mime type.
• A new filter wp_content_image_mimes which controls image mime type output selection and order for frontend content. Developers can use this to control the mime type output preference order for content images. Content images inserted from the media library will use the available image versions based on the order from this filter.

Thanks to the many contributors who helped develop, test and give feedback on this feature.

A haiku to summarize:

Upload a JPEG
Images of all sizes
Output as WebPs

Props flixos90, MatthiasReinholz, studiolxv, markhowellsmead, eatingrules, pbiron, mukesh27, joegrainger, mehulkaklotar, tweetythierry, akshitsethi, peterwilsoncc, eugenemanuilov, mitogh, shetheliving, clarkeemily, codekraft, mikeschroder, clorith, kasparsd, spacedmonkey, trevorpfromsandee, jb510, scofennellgmailcom, seedsca, cagsmith, karinclimber, dainemawer, baxbridge, grapplerulrich, sobatkras, chynnabenton, tonylocalword, barneydavey, kwillmorth, garymatthews919, olliejones, imarkinteractive, jeffpaul, feastdesignco, webbeetle, masteradhoc.

See #55443.

File:

• trunk/src/wp-includes/media.php (modified) (2 diffs)

trunk/src/wp-includes/media.php

@@ -1853 +1853 @@
             }
 
+            // Use alternate mime types when specified and available.
+            if ( $attachment_id > 0 && _wp_in_front_end_context() ) {
+                $filtered_image = wp_image_use_alternate_mime_types( $filtered_image, $context, $attachment_id );
+            }
+
             /**
              * Filters an img tag within the content for a given context.
@@ -1897 +1902 @@
 
     return $content;
+}
+
+/**
+ * Use alternate mime type images in the front end content output when available.
+ *
+ * @since 6.1.0
+ *
+ * @param string $image         The HTML `img` tag where the attribute should be added.
+ * @param string $context       Additional context to pass to the filters.
+ * @param int    $attachment_id The attachment ID.
+ * @return string Converted `img` tag with `loading` attribute added.
+ */
+function wp_image_use_alternate_mime_types( $image, $context, $attachment_id ) {
+    $metadata = wp_get_attachment_metadata( $attachment_id );
+    if ( empty( $metadata['file'] ) ) {
+        return $image;
+    }
+
+    // Only alter images with a `sources` attribute
+    if ( empty( $metadata['sources'] ) ) {
+        return $image;
+    };
+
+    $target_mimes = array( 'image/webp', 'image/jpeg' );
+
+    /**
+     * Filter the content image mime type output selection and order.
+     *
+     * When outputting images in the content, the first mime type available will be used.
+     *
+     * @since 6.1.0
+     *
+     * @param array  $target_mimes  The image output mime type and order. Default is array( 'image/webp', 'image/jpeg' ).
+     * @param int    $attachment_id The attachment ID.
+     * @param string $context       Additional context to pass to the filters.
+     * @return array The filtered output mime type and order. Return an empty array to skip mime type substitution.
+     */
+    $target_mimes = apply_filters( 'wp_content_image_mimes', $target_mimes, $attachment_id, $context );
+
+    if ( false === $target_mimes ) {
+        return $image;
+    }
+
+    // Find the appropriate size for the provided URL in the first available mime type.
+    foreach ( $target_mimes as $target_mime ) {
+        // Handle full size image replacement.
+        if ( ! empty( $metadata['sources'][ $target_mime ]['file'] ) ) {
+            $src_filename = wp_basename( $metadata['file'] );
+
+            // This is the same MIME type as the original, so the entire $target_mime can be skipped.
+            // Since it is already the preferred MIME type, the entire loop can be cancelled.
+            if ( $metadata['sources'][ $target_mime ]['file'] === $src_filename ) {
+                break;
+            }
+
+            $image = str_replace( $src_filename, $metadata['sources'][ $target_mime ]['file'], $image );
+
+            // The full size was replaced, so unset this entirely here so that in the next iteration it is no longer
+            // considered, simply for a small performance optimization.
+            unset( $metadata['sources'] );
+        }
+
+        // Go through each image size and replace with the first available mime type version.
+        foreach ( $metadata['sizes'] as $name => $size_data ) {
+            // Check if size has an original file.
+            if ( empty( $size_data['file'] ) ) {
+                continue;
+            }
+
+            // Check if size has a source in the desired mime type.
+            if ( empty( $size_data['sources'][ $target_mime ]['file'] ) ) {
+                continue;
+            }
+
+            $src_filename = wp_basename( $size_data['file'] );
+
+            // This is the same MIME type as the original, so the entire $target_mime can be skipped.
+            // Since it is already the preferred MIME type, the entire loop can be cancelled.
+            if ( $size_data['sources'][ $target_mime ]['file'] === $src_filename ) {
+                break 2;
+            }
+
+            // Found a match, replace with the new filename.
+            $image = str_replace( $src_filename, $size_data['sources'][ $target_mime ]['file'], $image );
+
+            // This size was replaced, so unset this entirely here so that in the next iteration it is no longer
+            // considered, simply for a small performance optimization.
+            unset( $metadata['sizes'][ $name ] );
+        }
+    }
+    return $image;
+}
+
+/**
+ * Check if execution is currently in the front end content context, outside of <head>.
+ *
+ * @since 6.1.0
+ * @access private
+ *
+ * @return bool True if in the front end content context, false otherwise.
+ */
+function _wp_in_front_end_context() {
+    global $wp_query;
+
+    // Check if this request is generally outside (or before) any frontend context.
+    if ( ! isset( $wp_query ) || defined( 'XMLRPC_REQUEST' ) || defined( 'REST_REQUEST' ) || is_feed() ) {
+        return false;
+    }
+
+    // Check if we're anywhere before the 'wp_head' action has completed.
+    return did_action( 'template_redirect' ) && ! doing_action( 'wp_head' );
 }