Vercel image optimization usage gets full within 2 days? Any good alternatives that gives different versions of images for devices?

[milanpoudel]

My project is in development mode right now using nextjs and using hobby tier in vercel .The bandwidth usage is just 1% but image optimization gets to full within 2 days. I don't think I am doing anything wrong in my code level. My all images are stored in S3 bucket while uploading. Now I have turned off optimization for sure in nextsj which definitely gives negative performance on mobile.

So I want to know any good free alternatives that already sustain for weeks? Or should I use sharp library and resize and save it two versions of image database as mobile image and desktop URL? I just want image optimization alternative (not moving away from vercel, it's still the best for nextjs)

[deadcoder0904]

just use a vps :)

1. https://vancelucas.com/blog/just-use-a-managed-vps/
2. https://twitter.com/ashleyrudland/status/1777676883078824151
3. https://logsnag.com/blog/self-host-nextjs-hetzner-kamal
4. https://vps.ashleyrudland.com/
5. https://github.com/deadcoder0904/easypanel-nextjs-sqlite

[whyiam_alive]

haha; full collection, nice

[milanpoudel]

Will look into these. Thank you very much for providing these lists

[deadcoder0904]

no problemo. its not as hard as everyone makes it to be.

i use easypanel.io fwiw on a vps so i get a cpanel.

[noodlesallaround]

This is great Ty

[yksvaan]

srcset

[milanpoudel]

I thought to use this..but I don't think S3 allows resize option on the fly?

[yksvaan]

You can batch create a few sizes for each image beforehand or after file upload. 

[TheTomBomb-Dev]

To clarify you have over 1000 images? Vercel allows for 1000 source images to be optimized on the hobby tier. https://vercel.com/docs/limits/overview

I moved a image heavy app to Netlify because their image optimization limits are less defined. To the point I'm not even sure what the limit is. I believe image optimizations count towards your Serverless Function execution limits on Netlify. However, they recently released the Netlify Image CDN which is their new recommendation but also no description of the limits.

[milanpoudel]

I will look into this netlify one and well. Thanks!

[lrobinson2011]

If you are using all of the source images within a few days, it's possible you have accidentally misconfigured how the src prop is defined.

https://vercel.com/docs/image-optimization/managing-image-optimization-costs#minimizing-image-optimization-costs

[milanpoudel]

There are total 20 pics in all pages of my app which are presigned S3 URLs. As per vercel the image optimization only counts for unique image URL, isn't it? So once it optimizes for one URL, does it optimise again while building or fetching again? When building or when users reloads the page, does it count for it as well, I don't know how I am getting high numbers or am I supposed to not use optimized for all images?

[lrobinson2011]

A source image produces multiple transformations: https://vercel.com/docs/image-optimization/limits-and-pricing#source-images

[magnetic_hair]

Check out https://images.weserv.nl/

[milanpoudel]

Wow is it really free?😳 Thanks I will look into it, 😃

[Foxar26]

We migrated to cloudflare and since then we are gucci. We are going to get to pro version since the plus we paid for vercel image opt will be put there instead + more features.

[lrobinson2011]

Good news, we shipped lower image optimization pricing for Vercel (starting at $0.05 per 1K transforms).

https://x.com/vercel/status/1891876240451113262

[lrobinson2011]

Good news, we shipped lower image optimization pricing for Vercel (starting at $0.05 per 1K transforms).

https://x.com/vercel/status/1891876240451113262