First Paint
- 首次渲染：从页面加载到首次开始绘制的时长
- 是衡量Web页面性能的一个重要指标
那么影响FP的指标是什么呢？其中之一是网络加载速度
// 不管是使用 HTTP 还是 WebSocket，他们都是基于TCP/IP协议的
// 下面从一个数据包的传输过程来对网络协议进行解读
互联网的数据都是通过数据包来传输的（数据包很大 => 拆包传输）
Internet Protocol (IP 协议/网络协议) - 网络层
- 目的：把数据包送达目的主机
- 定位到主机（每一台计算机在互联网上对应一个IP地址）
/*
数据包上会附加
1. 主机B的IP信息（寻址）
2. 主机A的IP信息（主机B信息回复时的寻址）
这些附加信息会被装进一个叫 【IP头】 的数据结构
IP头：（包含）IP版本、源IP地址、目标IP地址、生存时间等
*/
底层是物理网络
User Datagram protocol（UDP 协议/用户数据包协议）- 传输层
- 目的：把数据包送达应用程序
- 定位到应用程序
- 端口号 - 存在UDP头里的一串数字，通过端口号 UDP可以发送数据给指定的程序
IP是底层的协议，只能定位到主机，并不知道把数据包发送给那个应用程序，所以就衍生了UDP
/*
IP通过【IP地址】将数据发送给指定主机，UDP通过【端口号】把数据包分发给指定应用程序。
端口号附加在【UDP头】上，UDP头跟原始数据包合并组成新的UDP数据包
UDP头：（包含）目的端口号，源端口号等
*/
Transmission control protocol（TCP 协议/传输控制协议）- 传输层
- 目的：把数据
完整地送达应用程序 - 定位到应用程序（作用跟UDP一样）
- 端口号 - 存在TCP头里的一串数字
/*
TCP头包含：目标端口、源端口、【排序的序列号】（重排数据包）
*/
/*
【三次握手、四次挥手】
三次握手：建立连接前，客服端总共发送三个数据包给服务器，以确认连接的建立。
四次挥手：关闭连接
【数据传输阶段】
数据包丢失 -- 触发【重发机制】
大数据包传输 --【拆包】 -> 【重排】（依据TCP头的序列号进行数据包的重排）
*/
延伸点
UDP协议 & TCP协议 对比
UDP缺陷
1. 数据包在传输过程中易丢失
2. 大数据包拆分传输后不知如何重排
3. UDP没有重发机制
UDP优点
数据传输很快 - 没有三次握手、四次挥手 以及 数据包校验机制等
TCP优点（相较于UDP而言）- 传输阶段可靠
1. 数据包丢失会触发重发机制
2. 引入数据包排序机制
TCP缺陷：速度慢了
