为速度而生——百姓网如何优化网速_潘晓良.pdf

为速度而生 ——看百姓网如何优化网速 panxiaoliang@ 百姓网概况 国内领先分类信息网站 5000万动态请求/天 高峰1300次动态请求/秒 50台在线服务器 南北两个机房 30名员工 10名技术人员 2 百姓网有多快？ * 来自北京时间2011年3月30 日晚21:30 Alexa数据 3 优化之路 先交学费 对网速优化的理解 前端优化 后端优化 网络优化 4 先交学费：ETag 5 第一次访问 GET /image/baixing.gif HTTP/1.1 HTTP/1.1 200 OK ETag : 10c24bc-4ab-457e1c1f“ 6 第二次访问 GET /image/baixing.gif HTTP/1.1 If-None-Match: 10c24bc-4ab-457e1c1f HTTP/1.1 304 Not Modified 7 ETag是根据什么得出的？ Apache默认设置：inode-size-timestamp inode-size-timestamp inode-size-timestamp 8 ETag去掉，流量减半 9 补课 * 图书图片取自 10 页面渲染的过程 发送请求 等待响应 接收下载 11 我们对于网速优化的划分 前端 秒级别 涉及请求数，CSS ，JS ，图片以及页面布局部分 后端 毫秒级别 涉及代码优化，执行效率 网络 毫秒级别 涉及机房选择，CDN等网络相关内容 12 前端优化 13 优化容易，持续优化难 14 图片取自：/bbs/viewthread.php?tid=33856page=1 持续优化要解决的问题 如何监控前端呈现速度？ 如何收集最终用户的数据？ 15 如何前端监控？ Page Load Render DOM Start Ready 16 JavaScript记录时间 header script type=text/javascript var start = new Date().getTime(); window.onload = function(){ var time = new Date().getTime() - start; alert(time); } /script ... 17 如何统计真实用户数据？ Event Tracking /apis/analytics/docs/tracking/eventTrackerGuide.html 18 用Google Analytics记录时间 header script type=text/javascript var start = new Date().getTime(); window.onload = function(){