1

我正在开发一个应用程序,其中图像会根据不同的用户操作更改其来源。大约有 200 张图片可以以这种方式显示,我确信在某些时候会显示至少 90% 的折扣。

为了防止闪烁,我添加了一个图像预加载器。

但是,当我更改 IMG 的 SRC 属性时,浏览器会发送一个新的获取请求,即使图像已经加载。

根据分析器的说法,这样的请求平均需要大约 30 毫秒,所发生的只是浏览器无论如何都会从缓存中加载图像。

有没有办法阻止浏览器发送额外的请求并直接显示图像,或者这是不可能的?

如果不可能,将所有 200 张图像都放入代码中,然后只切换一个可见(或更精确地显示),这是一种不好的做法吗?

在预加载器中缓存和图像作为对象并且只切换它们怎么样?

我正在考虑的另一件事是将所有这些图像放入一个精灵并仅更改背景位置。

你认为最好的选择是什么?

4

1 回答 1

0

对于您所描述的快节奏图像交换类型,我推荐 CSS Sprites。如果您的图片很大并且您的观众可能包括相当数量的低速用户,这可能不是最佳选择,但您可以采取一些措施来隐藏它(例如首先加载一个小的静态图片,然后将其换成较大图像完成加载后的动态元素)。

该网站的其他方面从未完成,但我们在http://www.premiumframes.com/上使用了这些类型的大规模精灵技术来进行分层图像切换并填充下拉选择器中的图像。加载了相当多的数据,但对于买得起镜框的观众来说,该公司对性能非常满意。我怀疑您的需求不会像所需要的那样极端,因此您应该能够为中低层用户实现更好的性能。

于 2013-03-20T13:29:07.860 回答