优化javascript预加载图像

Bry*_* M. 6 javascript flash optimization

我想知道是否有人有任何优化通过javascript预加载图像的策略?

我正在将Flash应用程序移植到html/css中,尝试尽可能靠近原始站点重新创建UI.它本质上是一个照片浏览器应用程序,当用户将鼠标悬停在链接上时会显示高分辨率图像.每页大约有50-80个这样的图像.

单独预加载所有图像会产生比Flash应用程序更长的加载时间.数据量是相同的,但我必须假设更长的加载时间是由于每个图像必须对服务器进行的往返次数.

此外,即使在缓存了图像之后,我也在查看每个页面的显着加载时间,因为页面仍然需要联系服务器以获取每个图像以接收304 Not Modified代码.

有没有人有任何加快这个的建议?可能尝试创建一个可以在单个请求中下载的巨大图像精灵而不是每个只需要一个请求的50-80个较小图像是否有意义?这里的目标是实现与Flash站点类似的加载时间.

谢谢.我知道这听起来不是理想的做事方式.

Chr*_*ris 4

正如您所指出的 - 影响现代网页加载时间的最常见因素之一是客户端和服务器之间发送的大量小图像。最近的一些研究表明,对于 20 多个图像,80% 的加载时间将花费在进行如此多次获取的延迟上,而不是实际进行下载!

名为 SmartSprites 的工具是一种非常方便的方法,可以从所有许多小图像中“编译”单个大图像,这将实现更快的加载时间和图像预取。这是链接 http://smartsprites.osinski.name/