宏观视角下的浏览器

进程和线程

进程:是操作系统最小的执行单位

线程:是CPU最小的执行单位

进程:就是在内存中正在运行的应用程序

1、在内存中独占一个空间

2、每个进程之间是相互隔离的

线程:就是进程的最小单位

1、一个进程由多个线程组成

2、每个线程之间是相互隔离的

一个页面启动的时候启动了几个进程?

最少4个:

浏览器主进程

GPU进程(渲染动画)

网络进程

渲染进程

(插件进程)

计算机网络的七层模型

物理层:使用一定的物理介质(光纤、WiFi、网线) 通过 0和1 传输 电信号

链路层:MAC地址 封装byte

网络层:IP协议(主机A向主机B发送消息)

传输层:UDP协议(用户数据包协议)/TCP协议(传输控制协议) 端口

会话层:断点续传

表示层:翻译,解决不同系统之间数据传输的问题

应用层:HTPP协议

UDP协议:

只管发,不管收,如DNS解析、微信电话、流媒体

TCP协议:

1、重传机制

2、排序机制------根据数据包的编号对数据进行排序,保证数据包的完整性和准确性。

传输过程(三次握手):1、主机A发送消息给主机B 2、主机B回复确认消息给主机A 3、主机A回复确认消息给主机B

也可以分为四层:

物理层(物理层、链路层)

网络层 IP协议

传输层 UDP协议、TCP协议

应用层 (会话层、表示层、应用层)HTTP协议

备注:一般没有协议的层都不说很重要。

HTTP的请求流程

浏览器发送http请求的流程

1、构造请求行

2、查找缓存

3、准备IP地址和端口号

4、等待TCP队列 (一个域名最多只能建立6个TCP链接)----Chrome

5、建立TCP链接

6、发生http请求

服务器处理htttp请求

1、返回请求内容

2、断开连接

进程角度讨论

从输入URL地址到浏览器显示界面,这个过程中到底发生了什么?

1、浏览器主进程输入url请求

2、浏览器主进程将url请求派发给网络进程

3、网络进程发送url请求,获取响应头数据,解析响应头数据,之后将数据转发给浏览器主进程

4、浏览器主进程接受到网络进程响应的数据之后,发送"提交文档"消息给渲染进程

备注:提交文档就是:在浏览器主进程中,将网络进程中接收到的HTML数据提交给渲染进程。

5、渲染进程中接收到数据之后,准备接收HTML数据,接收数据的方式是直接和网络进程直接建立数据管道

6、文档数据传输完毕,渲染进程会返回"确认提交消息"给浏览器主进程

7、浏览器主进程,收到渲染进程"确认提交"消息之后,开始移除旧文档,替换新文档页面

相关推荐
名字还没想好☜8 小时前
kubectl 排障实战:jsonpath 精准取值、custom-columns、events 排序与 top 速查
运维·前端·chrome·docker·kubernetes
一条破秋裤9 小时前
C-数据类型
c语言·开发语言·chrome
万联WANFLOW11 小时前
AI Agent 落地新里程碑:Claude in Chrome 全面上线与安全架构解析
人工智能·chrome·安全架构
晴天1614 小时前
多个 VS Code 项目会导致 Chrome 和 Electron 应用一起卡住?-Day30
前端·chrome·electron
IPdodo_1 天前
2026年AI 数据采集代理 IP 选型:成功率、并发、轮换与成本评估
前端·网络·人工智能·chrome·python·http·网络调试
IT小白杨3 天前
哪种浏览器适合跨境电商?2026场景化方案建议与架构对比
服务器·chrome·经验分享·架构·安全架构·指纹浏览器
IT小白杨3 天前
多账号运营为什么需要独立浏览器环境:原理、机制与自测方法
服务器·chrome·经验分享·安全架构·指纹浏览器
ly76894 天前
浏览器工作原理详解:从入门到工程实践
chrome·firefox·edge浏览器
梦想blog4 天前
Claude Code + Chrome MCP:让浏览器自动化测试更简单
前端·chrome·自动化·mcp
Codiggerworld5 天前
Chrome DevTools 隐藏神技:这 5 个调试技巧你可能从来没用过
前端·chrome·chrome devtools