从输入URL到页面加载的全过程

news/2025/2/19 0:10:40/

从输入URL到页面加载的全过程
输入URL,并按下回车
浏览器检查浏览器缓存、系统缓存、路由器缓存,如果缓存中有,则直接显示页面,如果没有进行下一步
根据URL通过DNS进行域名解析,获取IP地址
DNS解析过程:是一个迭代查询和递归查询的过程

1. 首先会在浏览器的缓存中查找对应的IP地址,如果查找到直接返回,若找不到继续下一步
2. 将请求发送给本地DNS服务器,在本地域名服务器缓存中查询,如果查找到,就直接将查找结果返回,若找不到继续下一步
3. 本地DNS服务器向根域名服务器发送请求,根域名服务器会返回一个所查询域的顶级域名服务器地址
4. 本地DNS服务器向顶级域名服务器发送请求,接受请求的服务器查询自己的缓存,如果有记录,就返回查询结果,如果没有就返回相关的下一级的权威域名服务器的地址
5. 本地DNS服务器向权威域名服务器发送请求,域名服务器返回对应的结果
6. 本地DNS服务器将返回结果保存在缓存中,便于下次使用
7. 本地DNS服务器将返回结果返回给浏览器

浏览器向服务器发送TCP连接请求,进行三次握手
三次握手成功,浏览器向服务器发送http请求
服务器接收到请求,返回请求数据
浏览器接收数据并进行页面渲染(读取页面内容,浏览器进行渲染)

1. 首先解析 HTML 文档,形成 DOM 树
2. 接着解析 CSS,产生 CSSOM树
3. 在DOM和CSSOM树解析过程中,遇到 JS,会立即阻塞DOM树的构建,JS解析完成,接着解析HTML、CSS
4. 再接着,浏览器通过DOM和CSSOM树构建渲染树 ( Render树 )1. 这个过程中,DOM中不可见标签元素不会放到渲染树中,就像<head></head> 或 display:none2. CSSOM树规则会附加给渲染树的每个元素上
5. 渲染树构建完成,浏览器会对这些元素进行定位和布局,这一步也叫 重排/回流 ( Reflow) 或 布局(Layout )
6. 接下来绘制这些元素的样式,颜色,背景,大小及边框等,这一步也叫做 重绘 (Repaint)
7. 再接下来是我们这最后一步合成( composite ),浏览器会将各层信息发送给GPU,GPU将各层合成,显示在屏幕上

 断开TCP连接(四次握手)

注:

  1. SYN(同步):SYN是指同步序列编号(Synchronize Sequence Numbers)。在建立TCP连接时,客户端向服务器发送一个SYN标志的数据包,表示客户端希望建立连接。这个SYN包中会包含一个初始的序列号。

  2. SEQ(序列号):SEQ是指序列编号(Sequence Number)。在TCP连接中,每个数据包都有一个序列号,用于对数据包进行排序和重组。在三次握手过程中,客户端和服务器会交换各自的初始序列号,以便在后续的数据传输中进行正确的排序和确认。

下面是三次握手的步骤:

  1. 客户端向服务器发送一个带有SYN标志的数据包,该数据包中包含一个初始的序列号(SYN=1,SEQ=x)。

  2. 服务器接收到客户端的SYN数据包后,会回复一个带有SYN/ACK标志的数据包作为响应。这个响应数据包中会包含服务器的初始序列号和确认号(SYN=1,ACK=1,SEQ=y,ACK=x+1)。

  3. 客户端收到服务器的SYN/ACK数据包后,会发送一个带有ACK标志的数据包作为确认,表示客户端已经接收到服务器的响应(SYN=0,ACK=1,SEQ=x+1,ACK=y+1)。

通过这样的三次握手过程,客户端和服务器成功建立了TCP连接,并且双方都知道对方的初始序列号和确认号,可以进行后续的可靠数据传输。

 

文章来源:https://blog.csdn.net/VVVVV16/article/details/134824754
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.ppmy.cn/news/1260655.html

相关文章

springboot中@Builder注解的详细用法实例,跟数据库结合。

在Spring Boot中&#xff0c;Builder注解是Lombok库提供的一个注解&#xff0c;用于生成带有Builder模式支持的构造器方法。通过Builder注解&#xff0c;可以简化对象的创建过程&#xff0c;特别适用于需要设置多个属性的情况。 下面是一个使用Builder注解的示例&#xff1a; …

要求CHATGPT高质量回答的艺术:提示工程技术的完整指南—第 19 章:聚类提示

要求CHATGPT高质量回答的艺术&#xff1a;提示工程技术的完整指南—第 19 章&#xff1a;聚类提示 聚类提示是一种允许模型根据某些特征或特性将相似数据点分组的技术。 具体做法是向模型提供一组数据点&#xff0c;并要求它根据某些特征或特性将这些数据点分组。 这种技术适…

PAD平板签约投屏-高端活动的选择

传统的现场纸质签约仪式除了缺乏仪式感之外还缺少互动性&#xff0c;如果要将签约的过程投放到大屏幕上更是需要额外的硬件设备成本。相比于传统的纸质签约仪式&#xff0c;平板现场电子签约的形式更加的新颖、更富有科技感、更具有仪式感。 平板签约投屏是应用于会议签字仪式的…

多级路由component页面不加载

项目基于vue-element-admin 新建SubView.vue <template><router-view /> </template><script setup> </script>在父层添加component {path: /sj,component: Layout,redirect: /sj,name: 三级医院评审标准(2022),meta: {title: 三级医院评审标准(…

[足式机器人]Part2 Dr. CAN学习笔记-Ch0-1矩阵的导数运算

本文仅供学习使用 本文参考&#xff1a; B站&#xff1a;DR_CAN Dr. CAN学习笔记-Ch0-1矩阵的导数运算 1. 标量向量方程对向量求导&#xff0c;分母布局&#xff0c;分子布局1.1 标量方程对向量的导数1.2 向量方程对向量的导数 2. 案例分析&#xff0c;线性回归3. 矩阵求导的链…

RPC 集群,gRPC 广播和组播

一、集群抽象&#xff1a;cluster 它是指我们在调用远程的时候&#xff0c;尝试解决&#xff1a; 1、failover:即引入重试功能&#xff0c;但是重试的时候会换一个新节点 2、failfast: 立刻失败&#xff0c;不需要重试 3、广播&#xff1a;将请求发送到所有的节点上 4、组…

网络安全威胁——DDoS攻击

DDoS攻击 1. 定义2. DDoS攻击类型2.1 网络层攻击2.2 传输层攻击2.3 应用层攻击 3.DDoS攻击态势特点 1. 定义 分布式拒绝服务&#xff08;DDoS&#xff09;攻击是一种常见的网络攻击形式。攻击者利用恶意程序对一个或多个目标发起攻击&#xff0c;企图通过大规模互联网流量耗尽…

算法——滑动窗口

滑动窗口大致分为两类&#xff1a;一类是窗口长度固定的&#xff0c;即left和right可以一起移动&#xff1b;另一种是窗口的长度变化&#xff08;例如前五道题&#xff09;&#xff0c;即right疯狂移动&#xff0c;left没怎么动&#xff0c;这类题需要观察单调性(即指针)等各方…