基础必备
提示 🤠
navigation-timing 提供了可用于衡量一个网站性能的数据。与用于相同目的的其他基于JavaScript的机制不同，该API可以提供可以更有用和更准确的端到端延迟数据。
浏览器渲染过程
参考资料
navigation-timing
阶段一
- 准备卸载页面
- 重定向开始
- 卸载页面开始 2和3同时开始
- 卸载页面结束
- 重定向结束 （之前页面资源释放结束）
- 开始发起请求 （如果上一个页面为空则跳过之前）
- 查看本地缓存
阶段二
- 查询域开始 （DNS）
- 这部分可以优化--下面介绍和cdn配合
- 查询域结束
- 建立连接（TCP）
- 加密（可选）
- 连接建立成功 （握手结束）-->体现出网络质量
- 发起请求
- 服务器接收到请求，并发起相应
- 服务器处理
- 服务器发送数据结束 （可优化点服务器处理速度）
阶段三
- 解析 dom 开始 (阶段三可优化)
- 解析 dom 结束
- 加载依赖
- dom 事件绑定
- dom 准备完成
- dom 渲染完毕
- 执行 onload 事件内的脚本
总结
DNS 解析速度(阶段二);
TCP 连接速度(阶段二);
Response 返回速度(阶段二);
Processing 这个阶段,优化页面(阶段三, 前端优化重点))
onload 阶段决定什么时候初始化好(阶段三, 前端优化重点);
DNS
DNS 是Domain Name System, 域名系统，⽤于将域名转换为IP
根、顶级域
点之后的字母
参考链接: wiki 根
com,net,cn......
顶级域名
通过 .来区分，一个为顶级域名(一级域名)，两个为(二级域名) 以此类推
baidu.com 就是一级域名，也叫顶级域名
域名资源记录
记录： 域名要对应ip,一个对应就叫做一个记录
域名资源： 域名
| 记录类型 | 含义 |
|---|---|
| SOA(StartOf Authority, 起始授权记录) | ⼀个区域解析库有且只能有⼀个 SOA 记录，⽽且必须放在第⼀条，(一般这个不用理会，谁卖谁维护) |
| A记录(主机记录) | ⽤于名称解析的重要记录，将特定的主机名映射到对应主机的 IP 地址上, 映射:域名 -> ipv4 |
| CNAME记录(别名记录) | ⽤于返回另⼀个域名，即当前查询的域名是另⼀个域名的跳转， 主要⽤于域名的内部跳转，为服务器配置提供灵活性 |
| NS记录(域名服务器记录) | ⽤于返回保存下⼀级域名信息的服务器地址。该记录只能设置为域名，不能设置为IP地址。 |
| MX(邮件记录) | ⽤于返回接收电⼦邮件的服务器地址 |
| IPv6主机记录(AAAA记录) | 与A记录对应，⽤于将特定的主机名映射到⼀个主机的IPv6地址, 映射:域名 -> ipv6 |
参考链接: wiki 域名系统 记录类型
域名服务器
需要解析就要去找到服务器,域名解析的服务器就叫做域名服务器;
参考链接: wiki 根域名服务器
参考链接: wiki 名称服务器
域名解析
ip 地址：
x.x.x.x 文本 ipv4
x.x.x.x为int，4 个字节。一个字节范围 0~255。
F:F:F:F:F:F 文本 ipv6
总结：ip 域名其实就是一个编号
把域名转换成 ip 地址,采用递归和迭代两种方式
参考链接: wiki 域名系统 域名解析
在几十年前,计算机性能远不如现在,当你数据达到百万级就要考虑性能问题了,因此不可能吧所有的域名都放在一个机器上
所以在访问高频服务器时候会快，低频的会慢
DNS 作者想到一个办法: 分级维护
分级维护:
当你要访问网站的时候首先要解析域名, dns 服务器收到请求之后优先从本地缓存找(高频域名),如果缓存没有(找不到),就要向根域名(Root server)服务器(全球有 13 台，中国只有镜像，所以 IPV6 诞生)去查询
根域名服务器只去维护后缀;把后缀这一类的域名拿出来之后告诉 dns 服务器这个后缀的服务器去向哪个服务器查询
dns 收到这个服务器地址之后, 接着去找 TLD 服务器,它负责维护一级域名, 同样的它也干活, 返回名称服务器的 ip
dns 收到 TLD 服务器返回来的名称服务器地址之后, 再去名称服务器上去查询这个域名的 ip
dns 收到名称服务器返回的 ip 地址之后, 先把它丢到缓存里, 然后才会返回给客户端
缓存算法(空间换时间)
理论上来说,什么样的数据都可以写进缓存
但是有的有必要写缓存,有的没必要写缓存,有的是临时缓存
缓存算法最重要的就是：数据命中率
数据命中率，访问有效性
如何提高这个命中率：需要去动态的维护缓存里面的数据