减少带宽(从而减少页面加载时间)的有效方法?


Answers:


10

任何网站均可轻松实施的一些基本方法:

多一点参与:

  • 如果页面或图像不太可能更改,请告诉浏览器对其进行缓存。大多数Web服务器已经对静态文件执行此操作,因此您所要做的就是将它添加到动态脚本中(如果可能)。
  • 自动将CSS和JS文件合并为一个文件。这是有利的,因为它减少了HTTP请求(具有开销和某些愚蠢的浏览器-并且我的意思是Internet Explorer-默认每个域一次限制2个请求)。
  • 将您的静态文件(CSS,JS,图像等)移动到单独的域名。这将导致Cookie信息不会在HTTP请求中发送。
  • 使用自动生成的精灵。子画面是包含多个图标或其他小图像的单个图像。然后选择要使用CSS background属性显示的图像。实例

    优点是客户端发出的HTTP请求更少(有开销)。

我“自动”加粗,因为如果您手动执行这些操作,那么绝对不值得,这会使代码维护成为一场噩梦。通常,自动执行是指编写自定义脚本,这就是为什么它“很少参与”的原因,


我打算回答,但我想您已经涵盖了所有问题:)
Echo说恢复莫妮卡(Monica)2010年

开销确实是要考虑的重要事情,对于小文件,它们可以代表传输的数据的良好比例。
HolyVieR

除非您还仔细检查用户代理,否则不要使用deflate,因为Internet Explorer中存在有关deflate的错误。

@Kinopiko:是的,很好的建议。请参阅关于堆栈溢出的问题
Thomas Bonini 2010年

5

Google已概述并解释了他们的建议,以最大程度地减少有效负载大小。它们包括以下技术:

  1. 启用压缩
  2. 删除未使用的CSS
  3. 缩小JavaScript
  4. 缩小CSS
  5. 缩小HTML
  6. 推迟加载JavaScript
  7. 优化图像
  8. 服务缩放的图像
  9. 通过一致的URL提供资源

这些建议是其名为Page Speed的开源Firefox / Firebug附加项目的一部分。与Yahoo!的YSlow插件类似。实际的Page Speed加载项将检查比该列表详细说明的更多优化。还提供了使用Page Speed的说明。

Yahoo!的“ 加快网站访问速度的最佳做法”确定了一组类似的最佳做法:

  1. 最小化HTTP请求
  2. 使用内容交付网络
  3. 添加过期或缓存控制标头
  4. Gzip组件
  5. 将样式表放在顶部
  6. 将脚本放在最下面
  7. 避免CSS表达式
  8. 将JavaScript和CSS设为外部
  9. 减少DNS查找

(Yahoo!的清单大约有35个项目,无需全部引​​用。)

这两个YSlow的(图像链接)和网页速度(影像链接)可以让你在网页上运行测试,这件事情是你可以做的,并显示你什么,他们的建议,已经落实。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.