高性能网站建设指南-笔记（三）

总览

本书介绍了提高网站性能的14条规则：

1. 减少HTTP请求
2. 使用内容发布网络
3. 添加Expires头
4. 压缩组件
5. 将样式表放在顶部
6. 将脚本放在底部展示
7. 避免CSS表达式
8. 使用外部JavaScript和CSS
9. 减少DNS查找
10. 精简JavaScript
11. 避免重定向
12. 移除重复脚本
13. 配置ETag
14. 使Ajax可缓存

本书配套实例：点此访问

规则4-压缩组件

缩减http数据包大小

代码示例

• 目的： 减小页面大小，缩短网络响应时间
• 方法：gzip是目前最流行最有效的压缩方法

//浏览器头声明支持压缩
Accept-Encoding:gzip,deflate

//服务器头确认响应已被压缩
Content-Encoding:gzip

• 效果：压缩通常能将相应的数据量减少近70%

---

压缩规则：

• HTML、JS、CSS、XML、JSON建议压缩，其中JS、CSS最为普遍
• 图片、PDF不建议压缩，因为它们本来就已经压缩了，试图再次压缩只会浪费CPU资源，还有可能增大文件大小
• 通常对大于1KB或2KB的文件进行压缩。可以在服务端（nginx、apache等）进行配置.

书中提到的配置方法由于版本过老，不再记录。需要的话可以在各个web服务器软件的配置文件中学习。截止本文记录时，最新的配置方法见：Apache、Nginx

---

代理缓存

• 描述：当浏览器通过代理发送请求时，由于不同请求的来源浏览器对压缩的支持不一样，有可能造成代理上一份资源的缓存无法满足所有的客户端浏览器。
• 方法：web服务器的响应中添加Vary头。web服务器可以告诉代理根据一个或多个请求头来改变缓存的响应。Vary头的内容可以多种多样。

// 服务器头(response) Vary包含Accept-Encoding表示返回浏览器时，可以使用压缩过的资源。Vary不带这个标志，表示使用未压缩过的资源
Vary: Accept-Encoding

边缘情形

描述

只为已经证实过支持压缩的浏览器提供压缩内容，这被称作浏览器白名单方式

方法

可以在web服务器配置文件中，根据User-Agent来判断是否支持压缩;如果使用代理，可以在Vary头中加入User-Agent来综合判断。

// 这里的User-Agent指的是具体的浏览器的UserAgent的值，如Mozilla
Vary: Accept-Encoding, {User-Agent}

缺点

UserAgent有上千种值，代理不太可能对每一种组合进行缓存。这实际上破坏了代理缓存。

最佳实践

1. 如果用户较少，且浏览器行为相似。或者你更注意带宽开销，可以使用Vary:Accept-Encoding来支持压缩
2. 如果你的用户群量级大且多变，能够应付较高的带宽开销，可以使用Cache-Control:Private (Belongs to Response Header)来禁用代理缓存

赏

万水千山总是情 就给一毛行不行

支付宝

微信