Image optimisation question

[u/afrk]

I have a site, NextJS with WordPress. I used to use Next Image, but due to the sheer number of images (over 100k), I moved to offloading them to Cloudflare R2. I use CF image transformation, and the correct image sizes are served.

Do I still need to optimise the images with a plugin on WordPress? Or would that be redundant? I can think of one thing the plugins could do: change the format to WebP or AVIF.

[u/nameupp]

totally redundant, cf image resizing with format=auto already handles webp/avif on the fly based on the browser's accept header at the edge. the real move in next.js is plugging in a custom loader function for next/image (returning your cdn-cgi/image/width=${width},format=auto URL) so you keep layout shift protection and automatic srcset generation without vercel charging you for image optimization. only thing i'd keep in wordpress is the native big_image_size_threshold hook so editors don't upload raw 20mb camera raws directly into r2 and spike your first-hit transformation latency imo

[u/afrk → u/nameupp]

Images used to have no size limit, they are now optimised to max 4mb. I can’t recall but I used a package that does it in the browser before uploading. By the way, all uploads are through a custom dashboard

[u/RequirementGuide]

Yeah I agree with the others, the plugin would be redundant here. I did a similar move with R2 a while back and the one thing that actually bit me was the originals. Cloudflare still has to fetch and transform a giant original the first time a new size gets requested, so if your uploads are like 6000px straight from a camera it stays slow on that first hit. I ended up capping uploads at a sane max width before they hit R2 and that smoothed things out a lot. Also worth a quick check that WordPress is not still serving the raw originals anywhere like RSS or social previews, that is the one place the plugin would have helped and it is easy to miss.

[u/Witty-Estimate8594]

skip the wp plugin, you lose storage efficiency and r2 metadata just to create duplicates cloudflare cant use. set format=auto in your loader function so cf picks webp/avif at the edge based on the request header. this keeps layout stability in next image without bloating your bucket

[u/Careless_Tax_6418]

i dont think you need to optimize the same images twice

[u/Alarming_Ad_257]

Mostly redundant. Set format=auto in your CF transformation URLs and Cloudflare will serve AVIF or WebP based on what each browser supports, so you don’t need a plugin for that.

[u/prateekshawebdesign]

If you are using Cloudflare R2 with edge image transformations, pre-generating multiple WebP or AVIF formats on the CMS server is usually redundant and wastes server disk space. The critical detail with Next.js Image offloading to R2 is defining explicit width and height attributes or using fill with the sizes prop to eliminate Cumulative Layout Shift. For Largest Contentful Paint, make sure your hero images carry the priority prop so Next.js injects a preload link header, and ensure your R2 bucket passes public Cache-Control headers with long max-age and immutable directives so Cloudflare edge nodes cache the resized variants reliably.

[u/afrk → u/[deleted]]

I have to recheck the format option, to see if it is set.

Thanks

[u/Janczik_yelianny44 → u/[deleted]]

the bloat from those media library plugins gets out of hand so fast especially at 100k+ images, definitely redundant here