0

我有这个加载速度很慢的网页:https ://www.mlh-shop.com/press/233

该滑块中有 185 个小图像。如何优化它以加快加载速度?

我可以只加载几张图片,显示页面,然后在后台加载其他图片吗?

4

4 回答 4

3

浏览器对每个域允许的同时连接数有内置限制(现代浏览器默认为 8 个)。加快这一速度的一种方法是使用 CDN - 内容交付网络 - 从不同的域加载图像。

另一个问题是如何使页面尽可能快地可用。为此,您使用“延迟加载”,其中只有最少数量的图像与页面 HTML 一起加载,其余的则使用 JavaScript 动态加载。您发送图像列表,然后在页面完成加载后开始获取它们。

这并没有真正“加快”加载时间,而是允许在后台加载图像时立即使用页面。

您可以结合使用这两种技术以获得更好的性能。

于 2012-09-17T20:16:22.983 回答
1

I ran your site through Google Page Speed Analisys, here's what they suggest:

  1. Images are resized in HTML or CSS. Serving scaled images could save 3.4MiB (29% reduction).
  2. Optimizing (compressing their file size) the images could reduce their size by 2.6MiB (22% reduction).
  3. The cacheable resources have a short freshness lifetime. Specify an expiration at least one week in the future for your resources...

For #3 you could simply use an .htaccess rule to set the expiration date on downloaded assets. Here is a strait forward guid on doing that: http://css-tricks.com/snippets/htaccess/set-expires/

Cheers!

于 2012-09-17T20:21:27.977 回答
0

您可以做的一件事是将滑块中的所有图像预处理成一张大的静态图像。

于 2012-09-17T20:13:27.700 回答
0

您应该使用延迟加载。不要使用 PHP 输出所有 img 元素,而是稍后在客户端使用 JavaScript 创建它们。在您的情况下,这并没有真正的可用性损失,因为您的滑块已经使用 JavaScript,并且如果用户禁用了 JS,则无论如何都不会工作。

于 2012-09-17T20:14:32.593 回答