import images after build Sveltekit/vite

Question

I need to visualize, on my sveltekit-node website, a set of images that are uploaded via ftp to the server (after the website is built & deployed that is).

They are always changing but the name remains the same. So far I've used import.meta.glob to build the list of images but I've just realized that the images are copied over on the build/client dir so they do not change after build, so what options do I have?

Can I build the list of the files dynamically in some other way?

Should I rebuild the whole website when a new image arrives? (not really an option for me)

Make the ftp point to the build directory? Even changing the images there doesn't seems to have an effect!

--- [edit] Note: ideally, I'm looking for a solution where the name doesn't have to remain the same, but it could, if it simplify things.

I should also add that when a new image arrives a new websocket message is emitted (from python), and in my sveltekit I'm already subscribed to the websocket server on other pages, so I can trigger some sort of update of the page if is possible in some way.

I've tried to use globby in a sveltekit server endpoint but it doesn't seems to work inside sveltekit.

For solutions involving Express and the handler.js, please point me to some simple example of integration (I've never used Express)

Answer 1

They are always changing but the name remains the same [...]
Should I rebuild the whole website when a new image arrives?

If the name would be same but the contents change, I would recommend rebuilding, at least if you import the images properly so you get assets with a hash emitted (should happen automatically when importing in the script to get a URL). Otherwise you may run into caching issues where the image does not properly update if you just update it in place.

If changes happen a lot, I would recommend setting up a pipeline that automatically builds the application and deploys it.

With the Node adapter you could also start your own server using the middleware handler built from the adapter. You then could just set up a particular directory as containing static assets (e.g. Express.static when using express) and use a fixed paths to that location when referencing the image.

Since the path would be the same, you would have to set up the server in such a way that the cache behaves acceptably. I.e. if the image should update immediately, you could set it up to always validate (no-cache) before using the local browser cache, if it can be stale for a while, you could set a particular max-age, etc.