Most WordPress image problems are ordering problems. A plugin gets installed for WebP, then the theme's image sizes change, then someone notices half the media library is still JPEG and regenerates twice. Or the sizes attribute gets set in a template and an HTML minifier on the CDN strips it an hour later.
The configuration has a dependency order. Files on disk come first, the markup that points at them comes second, and the layer that rewrites the HTML comes last. Here is the chain, plus the parameters that usually stay at whatever the default was.
# Step Depends on
1 Decide rendered widths layout
2 Register only those sizes 1
3 Set output format, generate files 1, 2
4 Set the large-image threshold 3
5 Correct sizes per rendered context 2
6 Lazy loading and fetchpriority on the LCP image markup
7 srcset max width cap 2
8 Verify the delivered markup 3-7
9 Check anything that rewrites HTML 8
Steps 2-4 create files. Steps 5-7 decide which file the browser picks.…