web 性能优化的目的是为了让用户加载网站的速度变快。从地址栏的 url 按下回车那一刻到页面加载完成，这中间的过程有哪些是前端可以优化的？我们从这个过程说起...
DNS解析
- 可以通过 meta 标签告诉浏览器，页面需要做 DNS 御解析。
<meta http-equiv = "x-dns-prefetch-control" content = "on"> - 域名的发散和收敛
浏览器有域名的并发请求限制（chrome 为 6 个）。也就是同一时间最多向同一个域名发送 6 个请求。如果请求资源多，就将资源分布在不同的域名中。常见办法是使用 CDN 。
然而请求资源很少的情况下，为了减少 DNS 的开销，将资源放在同一个域名下。
TCP连接
TCP 连接复用（TCP Connection Reuse），在 HTTP 请求头中的 Connection 上加 keep-alive；HTTP/2.0 多路复用等。
发送 HTTP 请求
- 减小 cookie 体积
- cache-control
接收响应
- ETAG：资源不过期直接返回 304
- Gzip：压缩文件体积
- 懒加载
- 预加载
- 压缩图片
浏览器解析
- 正确的 DOCTYPE
<!DOCTYPE html> - CSS 文件放在 <head> 标签
- JS 文件放在 body 的末尾
网友评论