Como melhorar a eficiência [EDITADO]

Hola a todos, como verán en el título, es la primera vez que uso Astro para realizar una página semi-estática, ya que uso 3 hojas de google sheets como base y como es algo que se mostrará como catalogó no requiero de una base de datos por el momento...
Pero a lo que venía, al cargar las imágenes lo hice creando un componente en el cual puedo usar el loading="lazy" y aplicarle estilos con un solo bloque, pero no he encontrado una buena forma de poder optimizar las imágenes al momento de cargar, aunque uso las imágenes con la extensión .webp, pero cuando lo carga parece que se trabará o que tardará, lo que hice fue poner una imagen por defecto antes de la imagen y cuando carga la imagen se debería mostrar y es en ese momento que tarda.

Ya que he intentado usar npm install @astrojs/images pero al parecer este paquete ya no funciona(no lo instala)... Existe un paquete para astro que ayude a la carga de las imágenes, así como de forma diferida...Me cuesta un poco ya que siempre lo hacia con PHP para mi es más fácil de hacer optimizaciones y controlar el proceso...

ACTUALIZADO 20.09.2024:
Bueno encontré una nueva forma y al parecer se publicó ayer, esta es la unión entre Astro-Cloudinary una forma mucho más efectiva para obtener las imágenes y/o colecciones.

Publicado el día 19.09.2024 Astro x Cloudinary: Content Loader
Github cloudinary-community/astro-cloudinary

Hola, para la optimización de imágenes en Astro podrías valerte de herramientas externas como Cloudinary o Imgix, que ofrecen APIs REST para optimizar y entregar tus imágenes.

Internamente, podrías usar plugins de rollup o algo parecido para compilar y optimizar tus imágenes (usando libraries como sharp), pero esto podría complicar un poco tu build process.

Actualmente Astro no ofrece un paquete para optimizar imágenes, pero están trabajando en ello, por tanto te sugeriría seguir el repositorio de Astro en GitHub para estar atento. Te comparto una discusión relevante del repositorio: https://github.com/withastro/astro/issues/1072

Para la carga diferida debería ser suficiente con el atributo 'loading="lazy"', tu implementación actual debe funcionar correctamente. Podría ser que la carga de imágenes sea lenta debido al tamaño de estas.

Actualizado!