概述

  • 浏览器渲染过程
  • DNS
  • TCP 三次握手
  • HTTP 缓存机制
  • CDN 与集群

还记得 HTTP 协议吗?

  1. 浏览器先输入一个网址
  2. 然后浏览器先会去互联网上找 DNS 服务器进行解析
  3. 从 DNS 服务器拿到服务器 IP 以后,在回到浏览器中
  4. 然后浏览器拿着 IP 去发送 HTTP 请求
  5. 服务器处理请求
  6. 服务器响应请求
  7. 浏览器处理响应
  8. 继续请求其它资源

从 prompt 到 response 是和网络相关的,从 processing 到 onload 是和浏览器相关的。

  1. prompt for unload
  • 这一步是先把之前的页面干掉
  1. redirect、upload
  • 这一步是衔接前面的,也是和缓存相关的,浏览器发一个请求,是从缓存取,还是从服务器拿
  1. app cache
  • 如果要从缓存拿的话,我就处理本地应用 cache,如果没有就无所谓了
  1. DNS
  • 开始解析
  • 解析结束
  • 有这些事件我们就可以去在这些节点上进行优化
  1. TCP 层面
  • 三次握手
  • 开始连接 connectStart
  • https 连接 secureConnectionStart
  • 连接结束 connectEnd
  • 然后服务器会拿到你的请求路径
  1. Request 发送响应,但是连接还没完
  2. Processing 处理文档
  • domLoading 开始载入 dom
  • dominteractive 把文档设置为交互状态
  • domContentLoaded 触发这个事件
  • domComplete 浏览器把文档设置为 complete(表示文档与网络相关的修改已经结束了)
  1. onLoad (这个 onload 和,绑定那个 onload 事件是可以对应的)
  • loadEventStart
  • loadEventEnd

上面这是一次连接,然后下次再发请求的时候,回直接从 Request 开始。

是因为浏览器做了个优化,可以复用这个连接。

资源少就一个 tcp 连接,多任务就会打开多个 tcp 连接。keep-Alive 模式

如何优化

  • 网络:DNS、TCP 连接
  • 传输
  • 浏览器
  • 缓存,包括浏览器本身的缓存和服务器中的缓存

DNS

  • DNS 是域名系统,用于将域名转化为 IP
  • 顶级域名
  • 域名资源记录
  • 域名服务器
  • 域名解析

TCP 三次握手与四次挥手(如果少一次就不能保证,多一次就浪费。

  • 三次握手
    • 你发起连接请求
    • 服务源接受你发送的连接,然后服务源会给你发送一个数据
    • 然后你再发一条数据,告诉服务端我收到了
  • 四次挥手
    • 浏览器给服务源发送数据说我要挂了。
    • 服务源响应说我收到你的请求了可以挂,我也要挂了。
    • 然后浏览器发送数据可以断开。
    • 服务源断开连接。

osiiso 模型和 TCP/IP 模型

  • 应用层(data 数据。HTTP、FTP、DNS、DHCP)
  • 表示层
  • 会话层(TCPIC 把上面三个合并为应用层。HTTP 就在这层。这一层会加一个)
  • 传输层(TCP 协议、UDP 协议)
  • 网络层(它封装的是二进制,它是帮助你找到对方主机,IP、ICMP 这个是 ping 发的包)
  • 数据链路层(这一块是做了封装,数据链路层传递的是电脉冲信号,也是有一种规则的。网卡的 MAC 地址。ARP 是在局域网广播 MAC 地址,也有这种攻击,如我叫小明。)
  • 物理层(硬件、网卡、网线、承载你数据的基础设施。纯硬件)

tcpdump

  • -n 以 ip 地址显示
  • host 192.168.0.200 and 111.13.100.92
  • -i enp1s0 显卡地址

curl

  • 用命令行进行远程 http 通讯

CDN

  • 主机模式
  • CDN 离你最近的那台服务器