node.js - چگونه یک تصویر شخص ثالث را در حافظه پنهان قرار دهم

من یک وبسایت را مدیریت میکنم و در تلاش هستم تا بهترین امتیاز در عملکرد را با استفاده از LightHouse کسب کنم

من تمام فایلهای png/svg/... که ایجاد کرده بودم را در کش قرار دادم (Cache-Control: public, max-age=31536000)

اما همه تصاویر آمده از یک وبسایت شخص ثالث هیچکدام از آنها را ندارند

در اینجا سؤال من است: چگونه میتوانم این تصاویر را در حافظه پنهان قرار دهم؟

اینطور آنها را صدا میکنم (هیچ چیز خاصی نیست):

<img
    class="myclass"
    src="https://............."
    alt="my image"
    loading="lazy"
/>

من از Vue.js استفاده میکنم، بنابراین این در یک کامپوننت است

من از Nuxt و GCloud استفاده میکنم

لطفاً بگو اگر به اطلاعات بیشتری نیاز داری.

پاسخ شماره ۱

وقتی وبسایت شما میزبانی شود، مرورگر شما باید تصویر را خودش ذخیره کند بدون اینکه شما واقعا کاری انجام دهید. به صورت محلی، این کار جواب نمیدهد، اما اگر آن را میزبانی کنید، مرورگر شما خواهد دید که همان تصویر دو بار فراخوانی شده و آن را فقط از حافظه نهان میگیرد (تا جایی که میدانم، پروتکل HTTP این را مدیریت میکند).

در مثال من، وقتی برای اولین بار وارد صفحه شدم، sav2.png را صدا زدم، که ۴.۶ کیلوبایت دانلود شد. سپس، صفحه را بهصورت نرم بارگذاری مجدد کردم و از کش استفاده شد (هیچ فراخوانی اضافی به بکاند صورت نگرفت).

آن تصاویر چیز خاصی نیستند، تنها <img> ساده هستند که دارایی آن از ~/assets/images/sav2.png گرفته شده است.

در اینجا یک وبسایت در حال ساخت برای یک دوست وجود دارد: https://cyrielle-design.netlify.app/
این یکی از Cloudinary استفاده میکند اما همان الگوی گرفتن تصویر تنها یک بار و سپس استفاده از حافظه پنهان برای بارگذاریهای بعدی را دارد.