Hey everyone,

I’m running a self-hosted Next.js 15.5.0 app on a Debian server (managed with PM2 + Nginx reverse proxy). Images are served from Google Cloud Storage behind a CDN.

Here’s the issue:

When I use the Next.js <Image /> component with proper sizes, the images are very slow to load.

When I replace those with a plain <img> tag pointing to the same CDN URLs, the images load instantly.

Some extra context:

The app is not running in output: standalone mode.

sharp is installed on the server.

My next.config.ts has these image settings:

dangerouslyAllowSVG: true,
formats: ["image/webp", "image/avif"],
qualities: [100, 85, 75],
deviceSizes: [640, 750, 828, 1080, 1200, 1600],
imageSizes: [16, 32, 48, 64, 96, 120, 128, 159, 177, 256, 320, 384, 512],

Since the CDN is already optimized and serving the images quickly, I’m wondering if Next’s built-in optimization layer is causing extra processing or conflicts in this setup.

Has anyone run into this before? Ideally I’d like to keep <Image /> for responsive sizing and lazy loading, but right now it’s noticeably slower than <img>.

Any pointers on how to debug this or configure it correctly for a self-hosted + CDN setup would be greatly appreciated!