前端优化的本质：减少HTTP请求数量，尽可能快地载入网页

原因：浏览器对同一域下的资源，只保持一定的连接数

IE6,7 2个; IE8 6个; Firefox, Chrome 6个

Client端

  • 压缩图片
  • 制作成雪碧图(CSS Sprites)
  • 压缩合并css/js
  • 合理的标签位置(css放<head>里；js放<body>尾部，适当添加defer/async属性)
  • 文件名加上时间戳/md5
  • 结构化HTML，便于先加载关键的首屏内容
  • (可选) 极小图片base64转码放入CSS中 缺点：IE6/7不支持;IE8限制图片最大为32KB;无法缓存;体积要比原图片大;几乎无法被Gzip

Server端

  • Gzip
  • 合理设置HTTP头使用Cache link best practice
  • 将静态资源放入另外域名中(不会发送无用cookie)
  • CDN