我有一个图片库，除了一个问题外，它已经完成了。图库页面的滚动相当缓慢且缓慢。起初我以为只是这台计算机或浏览器，但它在拥有 10 倍图像的 facebook 画廊上运行并不慢。
页面加载后应该不再执行 javascript，所以我无法想象是我的 jQuery 导致了问题，但它可能是。有没有办法使用 Google 的开发者工具检查器或 Firefox firebug 来判断是否有 javascript 随时执行？我设置了断点并运行了代码，最终它停止了，我无法再进入任何功能。因此让我觉得它不是 jQuery。
查看网络日志，我只提取了 2.37MB 的图像和资产（这是在我清除缓存之后，所以每张图像都是全新加载的），所以我认为它不是纯图像大小。
最后，我什至检查了我的任务管理器 CPU 和内存使用情况，当我在该页面上时它没有飙升，所以我不认为这是任何类型的无限循环或内存问题。
这是滚动延迟的页面：Gallery
【问题讨论】：
标签： javascript jquery html optimization
EDIT2：您可以尝试实现图像精灵，但我真的 wouldn't recommend it 对于这种情况。
http://www.w3schools.com/css/css_image_sprites.asp
或者您可以使用 Photoshop 增加每个图像的图像优化。（如果您还没有这样做，建议您这样做。）...或像 http://kraken.io/ 这样的在线图像优化器
编辑：您可以通过确保所有 Javascript 都被引用为外部文件来大大提高速度，删除您拥有的嵌入 javascript。将所有 javascript 从您拥有它的最顶部移到之前...
</body>
如果可能的话，将所有 javascript 文件合并到尽可能少的文件中，并minify 它们。
一些可能的改进... http://analyze.websiteoptimization.com/
分析和建议
TOTAL_HTML - 恭喜，此页面上的 HTML 文件总数（包括主 HTML 文件）为 1，大多数浏览器都可以多线程。最小化 HTTP 请求是网站优化的关键。
TOTAL_OBJECTS - 警告！此页面上的对象总数为 41，其数量将主导网页延迟。考虑将其减少到更合理的数字。每页超过 20 个对象，处理实际对象的开销（描述时间和等待时间）占整个页面延迟的 80% 以上。有关对象开销如何支配网页延迟的更多详细信息，请参见图 II-3：显示对象开销主导网页延迟的延迟组件的相对分布。组合、优化和优化您的外部对象。用 CSS 翻转替换图形翻转以加快显示速度并最大限度地减少 HTTP 请求。考虑使用 CSS 精灵来帮助整合装饰性图像。使用彩色背景、边框或间距等 CSS 技术代替图形技术可以减少 HTTP 请求。用 CSS 文本标头替换图形文本标头，以进一步减少 HTTP 请求。最后，考虑通过使用不同的主机名或 CDN 来优化并行下载以减少对象开销。
TOTAL_IMAGES - 警告！此页面上的图像总数为 32 ，请考虑将其减少到更合理的数量。建议组合、替换和优化您的图形。用 CSS 翻转菜单替换图形翻转菜单，以加快显示速度并最大限度地减少 HTTP 请求。考虑使用 CSS 精灵来帮助整合装饰性图像。使用彩色背景、边框或间距等 CSS 技术而不是图形技术来减少 HTTP 请求。用 CSS 文本标头替换图形文本标头，以进一步减少 HTTP 请求。最后，考虑通过使用不同的主机名来优化并行下载以减少对象开销。
TOTAL_CSS - 注意。此页面上的外部 CSS 文件总数为 3 ，请考虑将其减少到更合理的数量。由于外部 CSS 文件必须位于 HTML 文档的 HEAD 中，因此必须先加载它们，然后才能显示任何 BODY 内容。尽管它们在后续请求时被缓存，但 CSS 文件会减慢页面的初始显示速度。合并、优化和优化您的外部 CSS 文件。理想情况下，您的页面上应该有一个（甚至为高流量页面嵌入 CSS）。您可以使用速记属性、分组来优化 CSS 文件，然后缩小和 GZIP 压缩它们以减少它们的占用空间。记得将 CSS 文件放在 HEAD 中，并将 JavaScript 文件放在 BODY 的末尾以启用渐进式显示。
TOTAL_SIZE - 警告！此页面的总大小为 2987624 字节，在 56Kbps 调制解调器上将在 603.63 秒内加载。考虑将总页面大小减少到 100K 以下，以在 56K 连接上实现低于 20 秒的响应时间。超过 100K 的页面超过了 56Kbps 的大多数注意力阈值，即使有反馈也是如此。考虑使用网站优化秘诀优化您的网站，加速您的网站或就我们的优化服务联系我们。 TOTAL_SCRIPT - 注意。此页面上的外部脚本文件总数为 5 ，请考虑将其减少到一两个。合并、重构和缩小以优化您的 JavaScript 文件。理想情况下，您的页面上应该有一个（甚至嵌入用于高流量页面的脚本）。考虑在服务器上将 JavaScript 文件缝合在一起以最小化 HTTP 请求。将外部 JavaScript 文件放在 BODY 的底部，将 CSS 文件放在 HEAD 中可以在 XHTML 网页中进行渐进式显示。
HTML_SIZE - 恭喜，此 HTML 文件的总大小为 1472 字节，小于 50K。假设您指定图像的 HEIGHT 和 WIDTH，此大小允许您的 HTML 在 10 秒内显示内容，这是用户愿意等待页面显示而没有反馈的平均时间。 IMAGES_SIZE - 警告！图片的总大小为 2900543 字节，超过 100K。考虑切换图形格式以实现更小的文件大小（例如从 JPEG 到 PNG）。最后，用 CSS 技术代替图形技术来创建彩色边框、背景和间距。 SCRIPT_SIZE - 警告！外部脚本的总大小为 65770 字节，超过 20K。考虑优化 JavaScript 的大小，组合它们，并在适合放置在文档 HEAD 中的任何脚本的情况下使用 HTTP 压缩。您可以将 CSS 菜单替换为基于 JavaScript 的菜单，以尽量减少甚至消除 JavaScript 的使用。
CSS_SIZE - 注意。你的外部 CSS 总大小为 19839 字节，大于 8K 小于 20K。对于外部文件，最好将它们保持在 1160 字节以下，以适应一个更高速度的 TCP-IP 数据包（或其近似倍数）。考虑优化您的 CSS 并消除功能以将其减小到更合理的大小。 MULTIM_SIZE - 恭喜，您所有外部多媒体文件的总大小为 0 字节，小于 10K。
【讨论】：