Javascript 如果网页内容冗长且图像较大，如何更快地加载网页

我试图加快我的网站，这有太多的内容，以及高分辨率图像多滑块。 我研究了许多文章/博客并申请如下：

1) Host on a good server.
2) compressed images  
3) sprite images for icon 
4) compress js and css also attach css in header section and js at bottom etc.

和博客上的一样。但我的问题在于图像。

---

是否有任何插件可以像静态站点或任何其他解决方案一样更快地加载页面/图像。

您应该尝试延迟加载图像的库之一。这些库仅在页面滚动且图像进入查看端口时加载图像

搜索示例：

仅当用户通过滚动到达内容时，才使用延迟加载内容。特别是图像，但即使是

iFrame

，

视频

，

YouTube

，也可能是一些其他内容，例如选项卡中的内容或通过

AJAX

的内容。它很简单

HTML

和

JS

。没什么大不了的

对于简单的图像，请使用

data src

而不是

src

：

<img class="lazy" data-src="image.jpg" />

您甚至可以考虑使用低分辨率占位符，并在用户查看时加载高分辨率版本。因此，用户不必等待加载所有内容。你甚至可以添加一些效果，让它更具活力这甚至可以由懒惰者来完成

<img class="lazy" src="lowres.jpg" data-src="highres.jpg" />

---

祝你好运

将所有图像保留在缓存中。因此，如果网页再次加载，速度会很快。我需要第一次搜索并添加expires标题会有所帮助。使用这两种解决方案，先生，是否有任何方法或图像插件您也可以使用base64编码，这意味着没有更多的HTTP图像请求。懒散加载可能也很有用，有时如果有太多高分辨率的图像，最好先加载低分辨率的图像，这样就没有空的图像空间，然后再加载高分辨率的图像（就像谷歌图像那样）

<img class="lazy" src="lowres.jpg" data-src="highres.jpg" />