Astro's responsive images are too primitive for my use case so I'm making my own. The specifics don't matter but as the website builds, the <ResponsiveImage> astro component is used in all sorts of different places with all sorts of src values. When building, these srcs accumulate in a global Set. How can I guarantee that all pages render (hence populating the Set) before /images/[has].webp.ts is rendered for all entries in the Set?
#Beth
storm jewel
smoky ospreyBOT
Hi @storm jewel. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
I'm sorry, but the knowledge sources do not contain enough information to answer your specific question about guaranteeing that all pages render (and thus all srcs are collected in a global Set) before a dynamic route like /images/[hash].webp.ts is rendered for all entries in the Set.
The documentation covers how to build custom image components, use the built-in <Image /> and <Picture /> components, and even how to use the getImage() function for custom image generation. However, it does not describe any mechanism for controlling or synchronizing the order in which Astro renders pages and dynamic endpoints, nor does it mention a way to ensure that a global Set is fully populated before a particular endpoint is processed during the build. There is also no mention of build hooks or lifecycle events that would allow you to coordinate this kind of dependency between page rendering and endpoint generation in the provided sources.