Images from Headless CMS to Netlify

Hi,

I built a blog using Nuxt.js and Cockpit CMS. And so far I really love this setup, I only have one problem: images.

Cockpit CMS is hosted on a VServer which acts more like a playground for some friends and me, so performance and caching aren’t a high priority.

But the images used in the blog are requested every time from this Vserver. Which could be okay, but I want to have a blazing fast website. Everything else is unacceptable! :smiley:

So I thought about a solution where I could transfer the requested images during build time to Netlify Large Media. Is this even a good idea? How would you handle this?

Thank you,
Luka :slight_smile:

Hi, @luha, and welcome to our Netlify community site.

You can use Netlify Large Media, but there are simpler ways to do this. Anything which makes the images available in the “publish directory” of the site at Netlify will work.

Often the site build process will download the files from the remote image store so that the files exist locally in the build system. This way, when the deploy occurs the images will be available on our CDN and served with the rest of the site content by Netlify’s systems.

For example, if these image assets are in your Git repo and placed in the static directory, the Nuxt.js will copy them to the publish directory and they be part of the deploy at Netlify.

This is just one way to do this and the “right way” is whatever best meets your requirements. If there are other questions about this, please let us know.

Thanks, for the warm welcome and the reply! :slight_smile:

I know that the following isn’t relying on Netlify, but may have an idea how to realize this:

Anything which makes the images available in the “publish directory” of the site at Netlify will work.

Do you know if there’s a webpack plugin that will fetch the images during build time?

Thanks,
Luka

1 Like

Hi, @luha, while our support team can answer questions about Netlify’s hosting, services, and features - making recommendation about the custom code used for builds is outside our scope of support.

Hopefully, someone else using webpack will have an answer but I personally don’t have any suggestions about how best to do this.