Understanding Vercel's Edge Request billing and how to optimise
Unanswered
Asiatic Lion posted this in #help-forum
Asiatic LionOP
I have recently launched an application and getting decent traffic to the site - a small free to use site. Its currently being hosted on the Vercel hobby tier and I have been watching the usage this past week. What I have noticed is that the Edge Requests is the largest consumer of the plan's resources.
Im curious as to how I can optimise some of these edge requests. For example, serving images (favicon + a logo) and potentially static files (_next/static/...). Its been suggested to use a file storage and CDN to serve these files but im not fully understanding how NextJS would then know how to import and reference these files? Thx
Im curious as to how I can optimise some of these edge requests. For example, serving images (favicon + a logo) and potentially static files (_next/static/...). Its been suggested to use a file storage and CDN to serve these files but im not fully understanding how NextJS would then know how to import and reference these files? Thx
12 Replies
Asiatic LionOP
Hey @B33fb0n3 , any of your input would be appreciated.
@Asiatic Lion I have recently launched an application and getting decent traffic to the site - a small free to use site. Its currently being hosted on the Vercel hobby tier and I have been watching the usage this past week. What I have noticed is that the Edge Requests is the largest consumer of the plan's resources.
Im curious as to how I can optimise some of these edge requests. For example, serving images (favicon + a logo) and potentially static files (_next/static/...). Its been suggested to use a file storage and CDN to serve these files but im not fully understanding how NextJS would then know how to import and reference these files? Thx
when you create an image and declare the image source to be on an external image, nextjs will just download this external image to use it
Asiatic LionOP
Ah right that makes sense. Is this similar for statically served files? (might be way off base on this one)
@B33fb0n3 when you create an image and declare the image source to be on an external image, nextjs will just download this external image to use it
Asiatic LionOP
Can this also apply to the favicon.ico that lives at the root?
@Asiatic Lion Ah right that makes sense. Is this similar for statically served files? (might be way off base on this one)
yea, the CDN delivers and caches the files. That can also be applied for the facivon
Asiatic LionOP
Does the CDN take care of this on its own? Or is there further config you need to setup to inform it to act this way? Thx
@Asiatic Lion Does the CDN take care of this on its own? Or is there further config you need to setup to inform it to act this way? Thx
that depends on which CDN you are using. Most of them already does it by default, but you should definitely check that
@Asiatic Lion solved?
Asiatic LionOP
@B33fb0n3 , not yet unfortunately.
@Asiatic Lion <@301376057326567425> , not yet unfortunately.
what else do you need to solve your initial issue?
@Asiatic Lion?
Asiatic LionOP
Hi @B33fb0n3 , I looked into this, setup s3, and im not sure the time/value tradeoff here is worth it compared to just dealing with NextJS and focusing on features vs additional management for now. My application also uses a middleware (clerk auth) that causes every page to be dynamic so I dont think I could even take advance of the cached cdn? Im not sure if at this point it makes sense.. any thoughts or experiences to share?