Web前端性能优化与测试定位方法

Posted by Shen Chaoran on August 27, 2019

雅虎34条黄金准则

工具

chrome: page speed firfox: YSlow

概念

静态内容和动态内容

  • 静态:文件在后台会不会发生变化,优化大多数都是针对静态内容进行优化
  • 动态:CGI/JAVA/PHP/Python等程序动态生成的内容

方法

压缩

  • 文本文件的压缩、混淆

缓存

  • 浏览器缓存
  • 反向代理服务器缓存
  • expires: 绝对失效时间,http 1.0
  • max-age: 设置对象的年龄,http 1.1
  • 协商缓存: If-Modified-Since/Last-Modified,浏览器第一次请求时,服务器端返回 last-modified, 再次请求时,将 last-modified 记录的时间附在 If-Modified-Since 字段下,在缓存过期的情况下,服务端根据此字段对比文件是否发生变化

并发

  • 同域名下 tcp(短)连接有并发限制(http 1.1)
  • 多域名部署
  • 动静分离,避免抢夺资源
  • 静态内容 CDN 就近访问

cookie

  • 本域名和父域名都会返回:cookie 的设定层级要合适,避免发送无关的cookie,减少上行包的大小,以及 cookie 超过长度限制