图像在您的网站上下载的顺序是什么？

Question

是否按照它们在标记中显示的顺序下载图像，或者是否存在显示的项目被下载的字母数字顺序？

我想知道，因为我想订购我的网站资产精灵在精选图片之前下载。

Answer 1

很难说，CSS中的标记和图像中有图像。没有任何规则，这取决于浏览器。

如果它们是按照源顺序请求的，则不能保证响应（所有图像数据）将按照它们请求的相同顺序接收。浏览器可以同时发出多个请求，因此它取决于图像的提供位置以及图像的大小。

此外，他们可能已经被缓存，我认为你可能过分地喋喋不休。

您可以尝试或查看一些JavaScript preloader例程或其他东西，但说实话，这不是一种需要担心的事情。用户习惯于这种体验。

最简单的实现是隐藏所有这些图像（使用JavaScript以便非JS不受影响）并等待页面的onload事件，然后您可以使用JavaScript计时器使图像按顺序显示您希望它们出现在屏幕上。

一旦所有关联的页面制品完成加载，onload事件就会触发，有时候这种情况永远不会发生（希望很少），或者花费一段难以忍受的时间。那么，你也可以有一个超时触发onload事件处理程序作为后备，以防万一发生这种情况，然后只显示你有什么。这是一种会导致我无法做任何事情的事情，并且保持简单。

如果问题是页面在图像加载时会回流，那是因为您尚未指定图像占位符的尺寸（例如IMG元素的宽度和高度属性）。

Answer 2

Firefox 好像按照它们在标记中显示的顺序加载图像。我相信Chrome和Internet也是这样做的。

您可以使用Firefox或Chrome控制台中的Firebug自行测试。