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

总览

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

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

本书配套实例：点此访问

规则9-避免重定向

缩短响应时间

代码示例

重定向类型

• 301 ：永久重定向
• 302 ：暂时重定向
• meta refresh : content的秒后，重定向到url指定的地址

  <meta http-equiv="refresh" content="0" url=http://website>

重定向会耗费请求时间并且降低用户体验

重定向时，浏览器会自动将用户带到location字段所给出的url，响应体通常为空。301和302在实际中都不会被缓存，除非有附加的头（Expires，Cache-Control）

重定向之外的选择

缺少结尾的斜线

发生在URL的结尾必须出现斜线(/)而没有出现时，会重定向到带有斜线(/)的url。（和容器相关）
当主机名缺少结尾斜线时不会发生重定向：因为浏览器在进行GET请求时必须指定一些路径，如果没有路径，会简单的使用文档根（/）

连接网站

一般用于网站后端被重写的时候，连接新旧两个网站

• 域名调用可以使用CNAME的方式
• 同一台服务器，后端自己连接

重定向的功能

• 跟踪入站流量：对于内部流量，值得通过建立Referer日志来避免重定向

  重定向的方法是跳转到本站一个地址（www.website.com/s/），然后再重定向(sports.website.com)。通过在日志中审计本站的地址，就可以统计出后续的跳转地址

• 跟踪出站流量：对于外部访问，可以通过信标的方式。

//html
<a href="http://en.wikipedia.org/wiki/Performance" onclick="resultBeacon(this); return false;">Performance - Wikipedia</a>

//js
var beacon;
function resultBeacon(anchor) {
    beacon = new Image();
    beacon.onload = gotoUrl;
    beacon.onerror = gotoUrl;  // in case the image fails, we still want to redirect the user
	beacon.anchor = anchor;
    beacon.src = "/bin/beacon204.gif?url=" + escape(anchor.href);
}

function gotoUrl() {
    document.location = beacon.anchor.href;
}

• 美化URL：类似于短域名的作用

最佳实践

寻找一种避免重定向的方法

赏

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

支付宝

微信