HTML ::如何提高在网页上加载图像的性能

Question

我有一个网页，可以在网页上加载近70-80张图像。我已经实现了延迟加载。我应该将这些图像保存在本地服务器上还是像picasa这样的图像网站上并从那里引用它？还是有更好的选择吗？在不降低性能和效率的情况下加载这些图像的最佳方法是什么？

请建议。

还有一个问题 - 为这些图像添加css动画效果是个好主意吗？

Answer 1

你可以做很多事情。

1. 使用像smushit这样的工具 - www.smushit.com来优化图像并减少加载时间。
2. 确保您没有通过设置不正确的宽度和高度来调整大图像的大小。
3. 从服务器上的子域调用图像。
4. 将用作背景/显示元素的图像合并为单个图像（称为精灵），并使用css仅调用单个图像的特定区域 - 这意味着它只会加载一次，从而减少HTTP请求。

您可以在此处获得有关使用Sprite的一些建议：http://css-tricks.com/css-sprites/

您还可以获取有关页面加载时间的更多信息，以及您可以通过http://gtmetrix.com/使用GTMetrix工具进行优化的事项