Portfolio CMS in Lovable, 8 MB photos and the bandwidth bill is climbing

You are serving a 6,000px image into a 600px box, twenty times per page. Fix the delivery first, it is one component swap.

Replace <img> with next/image and give it real sizes, for example sizes="(max-width: 768px) 100vw, 33vw". It serves AVIF or WebP at the width the layout actually uses, and caches the result. A 7 MB JPEG becomes roughly 60 KB at 600px. That alone is most of your bandwidth and most of the mobile slowness.

Then fix the storage: resize on upload to a sane maximum, 2,400px long edge, and keep the original in cold storage only if a designer needs the download. Right now every visitor pays for the archive copy.

Worth knowing which meter you are on. Vercel bills image optimization as transformations, so twenty distinct images per page is twenty transformations the first time and cache hits after. That is fine. What is not fine is a cache-busting query string on the URL, which some CMS uploads add on every render and which makes each view a fresh transformation. Check the rendered src in your page source before you conclude the numbers are just traffic.