JS:设置为display:block后,防止图像加载延迟

时间:2016-07-26 12:15:19

标签: javascript html css performance

在我的网站上,我需要切换完整文章的可见性。

当我将它们显示为display:block)时,文本显示得非常快,而图像所在的空间则为白色。一半或一秒后,图像出现一次(之前从服务器加载,因此不是概率xD)。

现在可能有一个解决方案,我可以将图像保存在RAM中。

我甚至不知道如何调用问题所以我在谷歌上找不到多少。

(将文章从DOM-Tree中删除非常重要,因此将不透明度或可见性设置为0不是解决方案。)

2 个答案:

答案 0 :(得分:1)

由浏览器决定如何存储和从缓存中提取图像。有很多因素,包括浏览器正在做什么,有多少图像,它们有多大等等。如果它花了这么长时间,它们可能会被迫退出缓存或者它们太大或者其他问题。您是否检查过以确保它们确实被缓存(同样,这可能与浏览器有关)?还要确保没有禁用缓存(在您的开发控制台或类似设备中)。

管理图像数据有很多潜在的选择,实际上取决于您正在做的最佳解决方案。

答案 1 :(得分:0)

This SO answer清楚地解释了这一点。简而言之,

  

如果您在页面上呈现HTML,即使它已隐藏,也会发生   加载。如果您希望图像仅在需要时加载,那么您就是   必须在图像标签上动态设置源(src)   的JavaScript。