Question

我正在使用Wordpress和大量图片的网站上工作。这些图像的分辨率为1000px到800px [W X H]，需要手动缩小到输入页面的拇指。拇指的大小各约为12KB。对于输入页面，需要加载45张图像。

我的问题是：以最佳性能加载这些图像的最佳方法是什么？应该用jQuery实现，在网站启动后加载图像？或者您更喜欢其他解决方案？

所有图片都是简单的HTML标记：

   <img src="image.jpg" width="200" height="150" alt="" class="thumb" />

Answer 1

使用延迟加载插件：

延迟加载长网页中的图像。外面的图像用户滚动之前不会加载视口（网页的可见部分）他们。

Answer 2

对我来说，就像制作每张图片的两张图片一样，一张是实际尺寸，第二张是缩略图，用.load()事件加载页面后显示所有缩略图，这样所有图像看起来都没有任何冲突，并在任何事件显示真实的形象..

Answer 3

您还可以使用HTML5清单文件缓存所有css，js和图像，以便更快地浏览。