gpt4 book ai didi

javascript - 优化图像的javascript预加载

转载 作者:数据小太阳 更新时间:2023-10-29 05:20:37 24 4
gpt4 key购买 nike

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

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

单独预加载所有图像会导致加载时间明显长于 Flash 应用程序的加载时间。数据量是相同的,但我必须假设较长的加载时间是由于每张图像必须与服务器进行的往返次数。

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

有人对加快速度有什么建议吗?尝试创建一个在单个请求中下载的巨大图像 Sprite 而不是 50-80 个较小的图像每个都接受一个请求是否有意义?这里的目标是实现与 Flash 站点相似的加载时间。

谢谢。我知道这听起来不像是一种理想的做事方式。

最佳答案

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

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

关于javascript - 优化图像的javascript预加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/959989/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com