html – 图像缓慢,当文档完成加载时,它们不会出现在页面上

前端之家收集整理的这篇文章主要介绍了html – 图像缓慢,当文档完成加载时,它们不会出现在页面上前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
目标:所有图像在第一次加载时显示

CURRENT:如果幸运的话,首次加载时会出现两到三张图像;要求页面重新查看所有图像。

这是我手头写的第一个网站。客户是设计师,所以质量图像很重要。性能和速度对我来说很重要,因为我现在在我的组合中,我不能接受部分功能的网站作为我的工作。

这是一个示例页面

http://elisamantovani.com/pages/book_design.html

查看其他页面。同样的问题。

更新:

许多人建议减少图像文件大小。无论如何,只有少数图像很大,但现在他们都很好。没有图像大于200kb,大多数图像检查< 100kb。问题依然存在。 Google正在提出阻止页面呈现的其他原因,例如渲染JS / CSS。 CSS应该阻止渲染直到加载,但不应该花费很长时间加载。我希望如果jQuery可以等到HTML / CSS呈现之后才可以。 刚进入缓存控制。添加到.htaccess以提高性能一点,但这只会在第一次加载后有所帮助,但需要首先加载。

# One year for image files
<filesMatch ".(jpg|jpeg|png|gif|ico)$">
Header set Cache-Control "max-age=31536000,public"
</filesMatch>
# One month for css and js
<filesMatch ".(css|js)$">
Header set Cache-Control "max-age=2628000,public"
</filesMatch>

解决方法

如果你想测量速度,你的脚本/图像加载速度你可以做的很简单。

转到Web检查器(或右键单击元素并点击“检查元素”),然后单击名为“时间轴”的选项卡。现在重新加载你的页面它会给你一个测量所需要的时间。

在我的电脑上,你的网站花了3.40s加载。不坏你似乎很好去

在旁边的笔记,如果您的图像正在加载缓慢它可能的图像不是脚本。确保您返回并在Photoshop中重新压缩它们,以便它们是最高质量/最低文件大小

这是一个截图

这是今天你的加载时间的SS。这似乎是一个主机问题。

原文链接:https://www.f2er.com/html/233095.html

猜你在找的HTML相关文章