Images Load slow but why? I (think) am using proper tooling

[dire halo]

I wanted to know what are some things I can consider / do to optimize load times of images within my nextJS project w/ Payload.

Currently...

• I am using supabase s3 to manage my images
• I am using ImageMedia to ensure I render them sized to the proper sizing that is optimal for current browser sizing. Here is a link to code I'm using for inspiration
• I am using supabase postgresql
• I am using a Media collection that supports different upload format sizes to work inline with my ImageMedia component. I am using webp format is that one the best?
• I am using vercel for hosting

Here is the link to my website so you can see the dark placeholder image stay longer than expected while waiting to render the image.
https://pipe-fitters.vercel.app/

cc/ @lofty lion

[sinful slate]

New Community-Help Thread Created!

Help is on the way! To mark it as solved, use the /solve command. In the meantime, here are some existing threads that may help you:

Documentation:

• Page Metadata - Root Metadata
• Using Payload outside Next.js - Importing the Payload Config outside of Next.js
• Environment Variables - Outside of Next.js
• What is Payload? - Instant backend superpowers
• Installation - Adding to an existing app - 5. Fire it up!

Community-Help:

• Problems deploying V3 to VPS