浏览器工作原理之网络传输及界面显示_浏览器网络传输的逻辑-CSDN博客

本文链接：https://blog.csdn.net/java_vava2/article/details/116134883

本文详细介绍了浏览器的工作原理，从浏览器进程、渲染进程到GPU进程和网络进程的角色。阐述了从输入请求到页面渲染的过程，包括TCP连接、HTTP请求、DNS解析、登录状态保持以及页面渲染的各个阶段，如DOM构建、样式计算、布局和绘制。讨论了HTTP协议、Cookie用于保持登录状态，以及DOM渲染时的重排和重绘等概念。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

浏览器工作原理

浏览器进程：打开一个浏览器会至少开启四个进程，1 个浏览器（Browser）主进程、1 个 GPU 进程、1 个网络（NetWork）进程、多个渲染进程和多个插件进程。

浏览器进程。主要负责界面显示、用户交互、子进程管理，同时提供存储等功能。
渲染进程。核心任务是将 HTML、CSS 和 JavaScript 转换为用户可以与之交互的网页，排版引擎 Blink 和 JavaScript 引擎 V8 都是运行在该进程中，默认情况下，Chrome 会为每个 Tab 标签创建一个渲染进程但若是同一个站点，则会使用同一个渲染进程。出于安全考虑，渲染进程都是运行在沙箱模式下。
GPU 进程。其实，Chrome 刚开始发布的时候是没有 GPU 进程的。而 GPU 的使用初衷是为了实现 3D CSS 的效果，只是随后网页、 Chrome 的 UI 界面都选择采用 GPU 来绘制，这使得 GPU 成为浏览器普遍的需求。最后，Chrome 在其多进程架构上也引入了 GPU 进程。
网络进程。主要负责页面的网络资源加载，之前是作为一个模块运行在浏览器进程里面的，直至最近才独立出来，成为一个单独的进程。
插件进程。主要是负责插件的运行，因插件易崩溃，所以需要通过插件进程来隔离，以保证插件进程崩溃不会对浏览器和页面造成影响。
不同线程可以共享进程数据，不同进程之间数据隔离，需要使用（IPC机制）实现进程数据共享。

从输入请求到页面渲染

衡量 Web 页面性能的时候有一个重要的指标叫“FP（First Paint）”，是指从页面加载到首次开始绘制的时长。UDP 为应用程序提供端口号，每个想访问网络的程序都需要绑定一个端口号。通过端口号 UDP 就能把指定的数据包发送给指定的程序了，所以IP 通过 IP 地址信息把数据包发送给指定的电脑，而 UDP 通过端口号把数据包分发给正确的程序。浏览器在网络传输过程中使用的是TCP协议发送HTTP请求。是由于TCP引入了数据包的排序机制，能够把乱序的数据包组合成一个完整的文件。
在这里插入图片描述
HTTP 协议是建立在 TCP 连接基础之上的。HTTP 是一种允许浏览器向服务器获取资源的应用层协议，通常由浏览器发起请求，用来获取不同类型的文件，例如 HTML 文件、CSS 文件、JavaScript 文件、图片、视频等。此外，HTTP 也是浏览器使用最广的协议。
在这里插入图片描述

连接过程

在浏览器地址栏中输入命令后，第一步浏览器会请求DNS返回域名对应的IP地址，并且浏览器提供DNS数据缓存服务，查找之前是否有解析的结果，HTTP协议默认80端口。chrome规定同一域名最多建立6个TCP连接。其余进入排队等待。等待结束建立TCP链接，浏览器向服务器发送HTTP请求（包括请求方法、请求URL和HTTP版本协议）。等待服务器处理HTTP请求并返回请求。最后断开连接。第二次请求时查看Cache-Control中的Max-age参数是否有缓存，如果缓存过期请求中附带If-None-Match，服务器判断请求的资源是否更新。