Images w/ next & vercel
I watched this video a while back where Theo warns against putting images and videos in the
/public directory when using vercel. It makes total sense.
What I'm trying to understand, though, is what is happening when I do this:
Is this essentially the same thing? I understand the bundler is picking up the image and bundling it, and inserting the url to it into my source, but am not sure what this means from the pov of vercel bills etc?
Is it best to avoid this approach?1 Reply
Hey man! I have a couple points
Next highly recommends not using the vanilla
<img> element but the built-in <Image> component they provide. This handles size optimization for different screen sizes and device speeds.
It is also a good practice to use a CDN for images, however particularly for larger and more images.
And yes, when you import and set an image the way you're doing it it grabs the image's data and puts it into the <img> element.
I assume you're just using this image in one place in your site?