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

Question

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

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

Answer 1

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

如果它们是按源顺序请求的，则无法保证响应（所有图像数据）将按照它们被请求的顺序接收。一个浏览器可以同时发出多个请求，因此这取决于图片从哪里提供，以及图片的大小。

它们可能已经被缓存了，我认为你可能对不必要的东西过于大惊小怪。

您可以试验或查看一些 JavaScript 预加载器例程或其他东西，但老实说，这不是那种需要担心的事情。用户已经习惯了这种体验。

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

onload 事件会在所有相关的页面工件完成加载后触发，有时这种情况永远不会发生（希望很少发生），或者需要很长时间。好吧，你也可以有一个超时来触发 onload 事件处理程序作为回退，以防万一发生这种情况，然后只显示你所拥有的。这种事情会让我根本不费心去做任何花哨的事情，而只是让事情变得简单。

如果问题是您的页面在加载图像时正在重排，那是因为您没有指定图像占位符的尺寸（例如 IMG 元素的宽度和高度属性）。

Answer 2

Firefox 似乎按照图像在标记中的显示顺序加载图像。我相信 Chrome 和 Internet 也是如此。

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