Web 性能优化详解

web 性能优化的目的是为了让用户加载网站的速度变快。从地址栏的 url 按下回车那一刻到页面加载完成，这中间的过程有哪些是前端可以优化的？我们从这个过程说起...

DNS解析

1. 可以通过 meta 标签告诉浏览器，页面需要做 DNS 御解析。
   
2. 域名的发散和收敛
   浏览器有域名的并发请求限制（chrome 为 6 个）。也就是同一时间最多向同一个域名发送 6 个请求。如果请求资源多，就将资源分布在不同的域名中。常见办法是使用 CDN 。
   然而请求资源很少的情况下，为了减少 DNS 的开销，将资源放在同一个域名下。

TCP连接

TCP 连接复用（TCP Connection Reuse），在 HTTP 请求头中的 Connection 上加 keep-alive；HTTP/2.0 多路复用等。

发送 HTTP 请求

1. 减小 cookie 体积
2. cache-control

接收响应

1. ETAG：资源不过期直接返回 304
2. Gzip：压缩文件体积
3. 懒加载
4. 预加载
5. 压缩图片

浏览器解析

1. 正确的 DOCTYPE
2. CSS 文件放在 标签
3. JS 文件放在 body 的末尾