Provide robust client-side and server-side image optimization tools

Created on 19 October 2020, over 4 years ago
Updated 1 July 2025, 12 days ago

Motivation/Background

One of the most significant areas of poor site performance continues to be the use of unoptimized image assets. Drupal core's image styles functionality was a significant step in the right direction - but does still require defining appropriate image styles during initial site configuration, and can often still result in the 'main' image being large and unoptimized, even if some of the other styles are better defined. Particularly as a site ages and editorial workflows naturally creep away from how the site was initially designed, a site is likely to have more adhoc insertions of unconstrained images from editors.

There are two strategies that could be used to better optimize images on the web:

  • Server-side: Using some sort of server-side library to optimize images before presentation.
  • Client-side: Presenting the user with image optimization at the time of upload.

As with the Lazy-Load initiative before this, this is another initiative in which Google would like to partner with the Drupal Association to put forward this core initiative to improve web performance. This initial idea was generated via a collaboration between the DA, Google staff, and @fabianx, @wim-leers, and @nielsvm.

Initiative overview

Likely as a sub-initiative of the Media initiative, the goal would be to collaborate on both the client and server-side techniques:

Server-side:

  • @fabianx has proposed that if LibGD could be updated for AVIF support across the php ecosystem, it could provide a server-sides optimization win not only for Drupal, but for the whole php ecosystem.
  • This will take external collaboration, however LibGD is maintained by some Googlers.

Client-side:

  • Investigate library options that can provide client side image optimization
  • One such option that the Google team supports and could help us with is Squoosh.app
  • Collaborate with media initiative team to see if these could be integrated

Contributor Team

  • Project Management and Communications: Drupal Association
  • Contributors:
    • Recruiting now!
  • Sponsors:
    • Google
    • Additional sponsors welcome

Process / Tools / Resources

Scope

We would like to limit the scope as much as possible to the actual action of image upload during the media insertion process, and then the server side rendering of images as would be handled by LibGD.

Timeline

If it all possible, we'd like to have working code with test coverage by the time of Drupal 9.2's alpha period. (April 2021)

✨ Feature request
Status

Closed: outdated

Component

Idea

Created by

πŸ‡ΊπŸ‡ΈUnited States hestenet Portland, OR πŸ‡ΊπŸ‡Έ

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

Production build 0.71.5 2024