http请求过程
正常普通流程:
- 域名解析
- 建立连接,TCP三次握手
- 发送请求(第三次握手发出去的同时)
- 解析html,构建dom树,css树,生成渲染树,显示页面。
一些细节
- 域名解析即寻找ip,通过查询dns服务器,流程:浏览器dns缓存(chrome://net-internals/#dns),本机dns缓存,HOSTS,若仍没有,则去请求系统配置的DNS服务器,如有缓存,则返回,还没有,则向根域服务器发出请求,跟域名反向查找,即根据域名顶级域名(如com,cn),二级域名,三级域名依次来回ip查询,直到返回并依次缓存记录。
- 三次握手有客户端发出,并且不需要等待第三次请求的结果。
- 一次完整的连接后,一般设置connection: keep-alive保持一定时间内可以持续连接(实现长连接)
- 解析html,从头到尾解析,构建dom树,如果遇到link css,则异步请求,不影响dom形成,但阻塞css树形成,遇到正常的script(async, defer未设置异步),则中断dom树形成,直到js加载完成并运行结束(因为js可能改变dom结构)
针对的优化
- cdn的使用,cdn的原理在于根据CNAME去获取CDN的服务器,并根据请求ip地区运营商,内容分发,负载情况,提供最近节点的cdn缓存服务器,cdn缓存服务器再去请求所需资源,同时返回客户端并本地进行缓存。
- 预加载的使用,比如preconnect, prefetch, preload的使用
- js放在dom树最后(避免多次重排),css样式放在顶部(避免页面多次渲染),图片设置好大小(占位,否则又要重排),请求资源合并,减少请求数量,利用缓存。