如何動態優化在頁面上加載10張以上全尺寸圖像？

Question

在我的頁面上 ，我一次動態加載10張圖片。 在大多數情況下，這些圖片的大小超過3000px，我只是調整它們的大小。 加載更多圖像（無限滾動）時，除非由於內存消耗，否則頁面會變得很漂亮。

有沒有一種方法可以真正快速地優化圖像？ 我當時在考慮使用API​​進行圖像壓縮，但是我認為這不是最有效的方法。 我正在嘗試不必實現服務器（不是我不能，但是我不想）。

有任何想法嗎？

Answer 1

最好的方法是調整服務器上圖像的大小。 可以使用https://github.com/willnorris/imageproxy之類的“圖像代理”或某些SaaS即時完成。 並且，為了減少服務器上的負載，您可以添加CDN，例如CloudFlare（免費）或CloudFront。