✔️ Add Support for EWWW Image Optimizer's Nginx Rewriting Rules (WebP)

[kolschsystems]

The popular EWWW Image Optimizer WordPress Plugin converts PNG and JPEG images into WebP format. EWWW IO's WebP conversion does not replace images, it makes a copy of the original with the exact same name, but in the WebP format and with a .webp extension added onto the end.

By default, the plugin will only create WebP images if they are smaller than the original format (JPEG or PNG), so Nginx should check to see if a converted WebP image exists.

I've added the map directive and location block recommendations from EWWW IO's Support Article:

---

📄 http.conf

map $http_accept $webp_suffix {
  default "";
  "~*webp" ".webp";
}

This tells Nginx to set $webp_suffix to ".webp" if the browser's Accept header contains "webp".

---

📄 static-files.conf

location ~* ^.+\.(png|jpe?g)$ {
  add_header Vary Accept;
  try_files $uri$webp_suffix $uri =404;
}

This tells Nginx to apply the enclosed rules to any files that end with png, jpg, or jpeg. The first rule adds the "Vary Accept" header to the return response, which is what allows supported CDNs to cache different files for the same URL. The second rule tells Nginx to look for a file that matches the original URL/URI with the $webp_suffix appended (.webp), and if that fails, to just deliver the original URI or fallback to a 404 if the file doesn't exist at all.

---

I've also added 'webp' to the list of cached file extensions in static-files.conf.

🍻 Cheers!