<img> 加载时间过长，使用 jQuery 和 Slides 插件答案

【问题标题】：<img> taking too long to load, using jQuery and Slides plugin<img> 加载时间过长，使用 jQuery 和 Slides 插件
【发布时间】：2011-12-02 08:49:39
【问题描述】：

我正在使用 jQuery 1.6 和幻灯片插件 (slidesjs.com)
幻灯片格式如下：<a><img></a>
加载第一张幻灯片的图像最多需要 6 秒。
从 Chrome 网络面板中，我知道图像被加载了两次，其中一次加载需要很长时间。

创建幻灯片的代码是：

$('.rotator').slides({
  preload: true,
  play: 7000,
  pause: 2500,
  hoverPause: true
});

在屏幕截图中，您将看到对 jquery-1.6.js @ line 2206 的引用，即：

attr: function( elem, name, value, pass ) {
  ...
  elem.setAttribute( name, "" + value ); // <-- line 2206

Chrome 的网络信息：

关于正在发生的事情以及如何避免这种情况的任何想法？

【问题讨论】：

这是检索图像所花费的网络时间。你无能为力。它在第一次加载后也被正确缓存，所以也没有什么可以改进的。连接缓慢？垃圾网络主机？可以是很多东西，但与 jQuery 或您的代码无关。
代码 304 表示文件自上次请求以来没有更改。您没有两次下载图像数据

【解决方案1】：

我有兴趣查看指向您已经构建的内容的链接。有很多事情可以考虑进行优化，例如：

等

如果页面加载时只显示几张图片，您应该确保在页面完全加载之前不要尝试下载其他图片，因为您会从更高优先级的元素中窃取可用资源。

【讨论】：