异步加载图片,提高HTML性能
忙了一上午,现在还没有吃饭。
在IE中通过ClientScript.GetCallbackEventReference(AspNet2.0)接口,实现no postback返回XML,解析后加载数据。
由于每个条目都要配一个小图片,如果条目很多时,比如1500条,加载时间会很长(本机30s),出现假死。
根据分析,是由于图片是同步显示的原因,如果不显示图片,只需要2s就加载完毕。
如何让图片显示不影响数据的加载成为问题的核心。
在img中没有找到标记异步的属性。突然想到iframe可以达到异步加载的效果,于是代码如下:
让iframe作为图片显示的容器,现在1500条7s加载完毕,图片在后台一个个慢慢的加载,呵呵。
感觉还是不够快,不知道是否还有其他的方法。
在IE中通过ClientScript.GetCallbackEventReference(AspNet2.0)接口,实现no postback返回XML,解析后加载数据。
由于每个条目都要配一个小图片,如果条目很多时,比如1500条,加载时间会很长(本机30s),出现假死。
根据分析,是由于图片是同步显示的原因,如果不显示图片,只需要2s就加载完毕。
如何让图片显示不影响数据的加载成为问题的核心。
在img中没有找到标记异步的属性。突然想到iframe可以达到异步加载的效果,于是代码如下:
imgElm=theDoc.createElement('iframe');
imgElm.border=0;
imgElm.frameBorder=0;
imgElm.marginHeight='0px';
imgElm.marginWidth='0px';
imgElm.style.width='20px';
imgElm.style.height='20px';
imgElm.src='images/obj_' + ObjType + '.gif';
fieldHolder.insertBefore(imgElm);
imgElm.border=0;
imgElm.frameBorder=0;
imgElm.marginHeight='0px';
imgElm.marginWidth='0px';
imgElm.style.width='20px';
imgElm.style.height='20px';
imgElm.src='images/obj_' + ObjType + '.gif';
fieldHolder.insertBefore(imgElm);
感觉还是不够快,不知道是否还有其他的方法。