预加载图像队列

Question

有没有办法更改我的图像队列顺序？

我有一张图片用作更大图片的 "blur" 预览。我使用 cms，所以有很多图像在我的图像之前加载。甚至忽略预加载。

顺序是：

带背景图片的正文
27 张图片
自定义预览图片

我尝试的是更改队列顺序

正文
自定义预览图片
27 张图片

我的图像是低分辨率图像。它是 85x53，大小约为 2.13kb。它从 1,4s 开始（有时甚至更晚）。

感谢您的帮助:)

亲切的问候，拉科乌

Answer 1

您可以尝试在正文顶部使用隐藏的 <img> 标记来强制浏览器提前加载它

像这样：

<!DOCTYPE html>
<html>
<head>
  <!-- ... -->
</head>
<body>
 <img src="your/preloaded/image.png" style="display: none;"/>
 <!-- ... -->
</body>
</html>

预加载图像队列

Preload image queue

html

css

image

preload