高性能网站建设

1. 高性能网站建设 Ctrip 技术开发部 潘斐斐 2010-03-08 [email_address]

3. 预处理 RTT 查询 DNS 建立连接 发送请求 等待响应 接收数据 读取 cache 处理元素 渲染元素 本地 网络 本地

4. 预处理 查询 DNS 建立连接 发送请求 等待响应 接收数据 读取 cache 处理元素 渲染元素 查询 Cache ：读取 Cache 或者发送 304 请求

6. 预处理 查询 DNS 建立连接 发送请求 等待响应 接收数据 读取 cache 处理元素 渲染元素 规则 2 -- 使用 CDN 美国十大 Internet 网站和 CDN 服务提供商 Ctrip 使用的 China-Cache 和网宿

8. 预处理 查询 DNS 建立连接 发送请求 等待响应 接收数据 读取 cache 处理元素 渲染元素 规则 5 -- 避免重定向 在重定向完毕并且 HTML 下载完毕之前，是没有任何东西显示给用户的 Google 和 ctrip 的重定向 涉及服务器负载、数据查询、服务器端缓存等

10. 预处理 查询 DNS 建立连接 发送请求 等待响应 接收数据 读取 cache 处理元素 渲染元素 规则 10 -- 添加 Expire 头 应用于不经常变化的组件，包括脚本、样式表、 Flash 组件、图片 Expires 和 Cache-Control 规则 11 -- 配置或移除 ETag 实体标签 (Entity Tag) 是 Web 服务器和浏览器用于确认缓存组件有效性的一种机制 ETag 截图 ETag 的问题 （ 只包含时间戳和大小或者移除 ETag ） 规则 12 -- 使用外部的 Js 和 Css 文件 如果网站中的每个页面使用了相同的 js 和 css ，使用外部文件可以提高组件的 重用率 。 主页使用内联方法（加载后下载、动态内联 [cookie] ） 规则 13 -- 使 Ajax 可缓存 被动请求 & 主动请求

11. 预处理 查询 DNS 建立连接 发送请求 等待响应 接收数据 读取 cache 处理元素 渲染元素 不要对 image 和 pdf 等二进制文件进行 gzip 压缩

15. 谢谢 ······

16. Ctrip 两张页面比较 Ctrip 首页 js 请求截图 Ctrip 某频道首页 js 请求截图

17. Ctrip 首页例子

18. Google 和 Ctrip 的重定向 http:// destguides.ctrip.com / http:// toolbar.google.com

19. 压缩如何工作

20. 请求 favicon.ico 的例子

21. Expires 和 Cache-Control Expires 头使用特定时间，要求服务器和客户端的时钟严格同步； Cache-Control 使用 max-age 指定组件被缓存多久，以秒为单位。可以重写 Expires 头。 Ctrip 首页某 JS 文件请求 Google 首页某 JS 文件请求

22. ETag 截图

23. Ctrip 某页面 CSS 的位置 http://stevesouders.com/hpws/css-bottom.php http://stevesouders.com/hpws/css-top.php http://stevesouders.com/hpws/css-fouc.php

24. 脚本位置截图 http://stevesouders.com/hpws/js-top.php http://stevesouders.com/hpws/js-bottom.php