马鑫：前端性能统计与优化

前端性能统计与优化 马鑫 为什么做这件事情 前端性能指标 如何统计与优化 原因：页面速度影响用户体验，我们要不断加强用户体验。为什么做这件事情 亚马逊：加载时间每增加100MS，就会减少1%的销售。 谷歌：加载10个结果0.4S，变成加载30个结果0.9S，降低20%的广告收入 目的：页面加载速度更快页面加载顺序1：用户点击链接或者输入URL2：下载完header3：下载完html4：下载完所有的资源前端性能指标 白屏时间 用户可操作时间 总下载时间 首屏时间 核心业务可用时间 前端性能统计与优化 非侵入式：Yslow，Pagespeed，Webpagetest，17ce 侵入式：插入JS代码 起始时间点1：从header头开始2：从用户点击开始HTML5 提供了performance API（performance.timing）Performance API白屏时间统计 DNS查找 TCP连接 发送请求 服务器响应 接收服务器内容 header静态资源 白屏时间优化 选用速度好的DNS服务器 JS CSS资源压缩与合并 使用CDN 静态资源缓存 启用GZIP JS放置在底部 用户可