Javascript 减小图像大小并保持100%宽度

我有一些图片在我的网站，从图片托管网站链接。所有图像都需要100%的宽度。
但是，有些图像的像素非常大，因此加载速度较慢
如何设置样式以减少图像像素，同时将图像保持在100%宽度，以便更快地加载？

---

例如，将水平像素固定为1440px，并调整垂直像素，使其保持100%宽度？

每个图像需要有两个版本，一个为原始大小，用户请求下载照片时可以使用，另一个用于显示和UI，这将使您的页面加载更快，数据带宽更少。

您对托管在其他地方的图像几乎没有控制权。一些替代想法：

• 将它们缓存在另一台服务器上并从那里加载
• 预加载以获得更快的结果（如果图像处于“折叠上方”，则可能无法进行预加载）
• 使用
  标记根据屏幕大小指定不同的图像：
• 首先加载占位符图像：