Image CDN
Also known as: image cdn, on the fly image resize, image optimization CDN
An image CDN is a content delivery network that stores, transforms, and serves images from edge servers close to the user. It can resize, re-encode, and compress images on the fly via URL parameters, then cache the result for fast, format-optimized delivery.
- Transformations (resize, crop, quality, format) are driven by URL parameters and cached at the edge.
- format=auto negotiates WebP or AVIF based on the browser's Accept header, falling back to JPEG.
- On-the-fly resizing means one source asset serves every screen size via responsive srcset.
How an image CDN works
An image CDN sits between your origin storage and the browser. When a request arrives, it fetches the source image once, applies transformations specified in the URL (width, height, quality, crop, format), and caches the derivative at edge locations worldwide so later requests are served from a nearby point of presence (PoP).
A typical request looks like `cdn.example.com/photo.jpg?w=800&q=75&format=auto`. The `format=auto` directive lets the CDN inspect the browser's Accept header and serve modern formats like WebP or AVIF when supported, falling back to JPEG otherwise — a technique called content negotiation.
Why it matters for performance
Serving correctly sized, modern-format images is one of the biggest levers for Largest Contentful Paint (LCP) and overall page weight. An image CDN removes the need to pre-generate every size; it produces and caches derivatives on demand, so a single source asset covers phones, tablets, and desktops via responsive `srcset`.
Common managed image CDNs include Cloudflare Images, Cloudinary, imgix, and Fastly Image Optimizer. They typically add automatic compression, DPR-aware sizing for high-density screens, and long-lived edge caching with cache-busting on URL change.