用new Image()预先加载图片真的有用吗？

katelin

浏览: 30666 次
性别:
来自: 厦门

最近访客更多访客>>

zuxianghuang

muzi131313

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

IE CSS 浏览器 Apache Cache

经常会用到在网页上交替显示图片。很多推荐的作法是用new Image() 预先装载图片。但是用new Image()真的有用吗？

试验：

在后台放一个过滤器捕捉所有 /* 的请求：

doFilter里面简单的打印请求的URL：


HttpServletRequest httpRequest = (HttpServletRequest) request;
System.out.println("requets url: " + httpRequest.getRequestURI());
chain.doFilter(request, response);

html代码：

<body>
<script>
	var t1 = new Image();
	t1.src = 'ico_unchecked.gif';
	
	function change(){
		im.src = t1.src;
	}
</script>
<button onclick="change()">change</button>
<img id="im" src="ico_checked.gif">
</body>

可以看到打印了三次url。html页面的请求一次。t1.src设值的时候一次。<img src="">的时候一次。

我想这时候如果按按钮改变页面上的图片，应该不会再从服务端载图片了，因为缓存里面已经有了嘛。可是点的时候过滤器仍然是有打印出URL！

看来只要image对象的src一被改变就会发出请求。那预先装载图片不是等于没用吗？

分享到：

瞒天过海法处理父类构造函数带参数 | 类的实例的问题

2007-09-20 16:39
浏览 9160
评论(4)
论坛回复 / 浏览 (4 / 9886)
分类:Web前端
查看更多

4 楼 hax 2007-09-20

注意，IE其实存在图片缓存bug，但是通常它并不会导致一次新的请求，只是会产生多次的WinNET API调用，效果就是有轻微的闪烁。

此外，Filter（AlphaImageLoader）和VML的image，都分别存在一些缓存上的问题（Shame M$）。但是这里并没有涉及到。

3 楼 hax 2007-09-20

你的测试有误。

new Image()绝对可以起到预取作用。

之所以你测试中会有新的请求，估计是以下原因之一：

A. 你的浏览器设置存在问题。例如在IE中默认是“自动”而你可能改成了“每次访问都检查网页更新”。

B. 你的服务器端程序有问题。例如发出了禁止Cache的头。

C. RPWT

2 楼 sp42 2007-09-20

推荐CSS Background的方式

1 楼 scud 2007-09-20

很多server(例如apache)会对请求进行分析, 如果根据 last modified time 判断文件没有改变, 则返回 "304 - 未修改".

请求相同的url并不表明传输回去的内容大小也相同

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论