Hey,
AFAIK, the images get resized/optimized at build time so Gatsby Cloud does not have to add extra support for this.
Indeed next/image works differently, since images get optimized at request time there!
Neat, thanks Thomas. I switched from Gatsby to Next specifically for the image optimizations (and they're fantastic), but it locks you in to hosting at Vercel or needing to customize a connection to Cloudinary.
Vercel is great but costs $20/month for any commercial use (vs. free at Netlify), though it seems relatively easy to run out of free image transformations at Cloudinary (25k/monthly).
If you have to pay for Cloudinary ($99/mo for 225k transformations/monthly) then Vercel (unlimited free bandwidth & transformations AFAIK for $20/mo) looks like a much better deal. Of course, there are many other image providers, several of which are pre-loaded by Next.js.
So it's an interesting point that Gatsby avoids this particular issue entirely with their approach. I'm really enjoying the Next.js development experience (as it's so much better than Gatsby 2), but I'll definitely spin up a Gatsby 3 / Gatsby Plugin Image site probably using Gatsby Cloud to try things out.
That's a good point! The cost of hosting/bandwidth is certainly something you need to keep in mind when using the Next.js
But on the other hand, with Gatsby the images get optimised at build time, and your build will possibly take a little extra time when you're transforming a lot of images. Depends on what you find most important I guess :-)
Yeah absolutely, Gatsby vs Next will have a build time tradeoff as well.
I was really impressed by being able to make 20 image sizes dynamically with Next (probably overkill) with basically no performance penalty, whereas I imagine that "laziness" would mean a big build time with Gatsby.
Next has a static / export mode, but currently it excludes their image optimization tool.
Nice chatting with you Thomas!
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Hey,
AFAIK, the images get resized/optimized at build time so Gatsby Cloud does not have to add extra support for this.
Indeed next/image works differently, since images get optimized at request time there!
Neat, thanks Thomas. I switched from Gatsby to Next specifically for the image optimizations (and they're fantastic), but it locks you in to hosting at Vercel or needing to customize a connection to Cloudinary.
Vercel is great but costs $20/month for any commercial use (vs. free at Netlify), though it seems relatively easy to run out of free image transformations at Cloudinary (25k/monthly).
If you have to pay for Cloudinary ($99/mo for 225k transformations/monthly) then Vercel (unlimited free bandwidth & transformations AFAIK for $20/mo) looks like a much better deal. Of course, there are many other image providers, several of which are pre-loaded by Next.js.
So it's an interesting point that Gatsby avoids this particular issue entirely with their approach. I'm really enjoying the Next.js development experience (as it's so much better than Gatsby 2), but I'll definitely spin up a Gatsby 3 / Gatsby Plugin Image site probably using Gatsby Cloud to try things out.
That's a good point! The cost of hosting/bandwidth is certainly something you need to keep in mind when using the Next.js
But on the other hand, with Gatsby the images get optimised at build time, and your build will possibly take a little extra time when you're transforming a lot of images. Depends on what you find most important I guess :-)
Yeah absolutely, Gatsby vs Next will have a build time tradeoff as well.
I was really impressed by being able to make 20 image sizes dynamically with Next (probably overkill) with basically no performance penalty, whereas I imagine that "laziness" would mean a big build time with Gatsby.
Next has a static / export mode, but currently it excludes their image optimization tool.
Nice chatting with you Thomas!