文章目录
-
- [🧭 一、总体架构概览](#🧭 一、总体架构概览)
- [🧩 二、核心进程架构](#🧩 二、核心进程架构)
-
- [1. Browser Process（浏览器进程）](#1. Browser Process（浏览器进程）)
- [2. Renderer Process（渲染进程）](#2. Renderer Process（渲染进程）)
- [3. GPU Process（GPU 进程）](#3. GPU Process（GPU 进程）)
- [4. Network Process（网络进程）](#4. Network Process（网络进程）)
- [5. Utility / Plugin / Extension Process](#5. Utility / Plugin / Extension Process)
- [⚙️ 三、渲染流程（Pipeline）](#⚙️ 三、渲染流程（Pipeline）)
- [🧠 四、核心模块解析](#🧠 四、核心模块解析)
-
- [1. Blink（Web 引擎）](#1. Blink（Web 引擎）)
- [2. V8（JavaScript 引擎）](#2. V8（JavaScript 引擎）)
- [3. Mojo IPC（跨进程通信）](#3. Mojo IPC（跨进程通信）)
- [4. Compositor（合成器）](#4. Compositor（合成器）)
- [5. Skia（2D 绘图库）](#5. Skia（2D 绘图库）)
- [🔒 五、安全与沙箱机制](#🔒 五、安全与沙箱机制)
- [📚 六、线程模型简述](#📚 六、线程模型简述)
- [🚀 七、性能优化策略](#🚀 七、性能优化策略)
- [🔧 八、开发与目录结构（简要）](#🔧 八、开发与目录结构（简要）)
- [🧾 九、总结](#🧾 九、总结)
Chromium（开源版 Chrome 浏览器） 的技术架构。
这份介绍会从整体架构到关键模块层层展开，帮助你理解 Chromium 是如何实现高性能浏览器的。
🧭 一、总体架构概览
Chromium 是一个 多进程、多线程 的现代浏览器框架，核心目标是：
稳定、安全、高性能、可扩展。
其架构大致可分为以下几个层级：
┌──────────────────────────┐
│ 用户界面层（UI） │
├──────────────────────────┤
│ 浏览器进程（Browser） │
├──────────────────────────┤
│ 渲染进程（Renderer） │
│ 插件进程（Plugin） │
│ GPU 进程（GPU Process） │
│ 网络进程（Network） │
├──────────────────────────┤
│ 操作系统与硬件层 │
└──────────────────────────┘🧩 二、核心进程架构
Chromium 的进程模型（Multi-Process Architecture）是其性能和安全性的核心。
1. Browser Process（浏览器进程）
负责全局控制和系统交互，是"调度中心"。
主要职责：
- 管理窗口与标签页（UI）
- 网络调度与缓存
- 安全沙箱与权限控制
- 控制渲染进程的创建、销毁
- 负责用户输入、地址栏、书签、历史记录等
关键模块：
content/browser/chrome/browser/
2. Renderer Process（渲染进程）
这是 Chromium 的 "浏览器内核"（相当于 Blink + V8）。
主要职责：
- 解析 HTML、CSS、JavaScript
- 布局与绘制（Layout & Paint）
- 执行 JavaScript（通过 V8 引擎）
- 生成 DOM 树与渲染树
- 将绘制命令发送给 GPU 进程合成显示
每个 Tab 通常对应一个独立的渲染进程。
关键组件：
- Blink：网页渲染引擎（派生自 WebKit）
- V8：JavaScript 引擎
- WebIDL / DOM / CSSOM / Layout / Paint / Compositor
3. GPU Process（GPU 进程）
负责加速图形绘制和合成。
职责：
- 处理 WebGL / Canvas / CSS 动画
- 管理 GPU 命令队列
- 合成多个图层（Compositing）
- 与系统显卡驱动交互
渲染进程不直接访问 GPU，从而提高安全性。
4. Network Process（网络进程）
从 Chromium M73 起独立出来。
职责：
- 处理所有 HTTP/HTTPS 请求
- Cookie、缓存、代理、CORS
- QUIC / HTTP/2 / WebSocket
- 下载与上传管理
5. Utility / Plugin / Extension Process
- Utility：音视频解码、文件读写等敏感任务
- Plugin：传统 NPAPI 插件（已废弃）
- Extension：独立沙箱环境运行 Chrome 扩展程序
⚙️ 三、渲染流程（Pipeline）
以下是 从 URL 到屏幕像素 的关键数据流：
URL → Browser Process
→ Network Process
↓ HTML 文本流
→ Renderer Process
↓
┌──────────────────────────────┐
│ Blink 引擎渲染管线 │
│ 1. Parse HTML → DOM Tree │
│ 2. Parse CSS → CSSOM │
│ 3. JS 修改 DOM/CSSOM (V8) │
│ 4. 构建 Render Tree │
│ 5. Layout (计算几何尺寸) │
│ 6. Paint (绘制指令) │
│ 7. Compositing (图层合成) │
└──────────────────────────────┘
↓
→ GPU Process (显示)
↓
→ 屏幕显示像素🧠 四、核心模块解析
1. Blink（Web 引擎）
源自 WebKit，负责：
- DOM、CSS、布局、渲染树
- 事件模型
- 多媒体、动画
- Web 标准实现（HTML5、CSS3、WebRTC、WebGPU 等）
位置：/third_party/blink/
2. V8（JavaScript 引擎）
Google 自研高性能 JS 引擎，支持：
- JIT 编译（TurboFan）
- 垃圾回收（Orinoco GC）
- WASM 支持
- 与 Blink 的
DOM bindings连接
位置：/v8/
3. Mojo IPC（跨进程通信）
Chromium 进程间通信的基础框架。
-
高性能、异步、基于消息的通信机制
-
替代早期的 IPC::Channel 系统
-
各个进程之间通过 Mojo 接口调用，如：
Browser ↔ Renderer ↔ GPU ↔ Network
位置：/mojo/
4. Compositor（合成器）
在 Blink 渲染后，将页面分成多个图层交由 GPU 处理。
- 实现 硬件加速滚动与动画
- 每个 Layer 都有自己的纹理缓存
- 使用 Skia + OpenGL/Vulkan/Direct3D
5. Skia（2D 绘图库）
Google 的跨平台绘图引擎，Chrome、Android、Flutter 都在用。
负责：
- Canvas、图片、字体、路径绘制
- 抽象底层 GPU / CPU 渲染接口
位置：/third_party/skia/
🔒 五、安全与沙箱机制
Chromium 的安全核心理念：隔离与最小化信任。
- Renderer、GPU、Extension 等进程都运行在 Sandbox 沙箱 中
- 只有 Browser Process 拥有系统权限
- 通过 IPC 传递数据，防止跨域、代码注入攻击
📚 六、线程模型简述
在每个渲染进程内部，还有多线程结构：
Renderer Process
├─ Main Thread（UI + JS + DOM）
├─ Compositor Thread（图层合成）
├─ Raster Thread（栅格化绘制）
├─ Worker Threads（Web Worker）
├─ Audio/Video Thread🚀 七、性能优化策略
Chromium 为性能做了大量架构设计：
| 优化方向 | 实现机制 |
|---|---|
| 并行化 | 多进程 + 多线程 |
| 渲染加速 | GPU 合成与绘制 |
| JS 优化 | V8 JIT 编译 |
| 内存管理 | 分页回收、延迟加载 |
| 启动优化 | Lazy Init / ServiceWorker Cache |
| 响应优化 | Input latency 减少主线程阻塞 |
🔧 八、开发与目录结构（简要）
主要源码路径：
/content/ Chromium 通用浏览器框架
/chrome/ Chrome 浏览器特有实现
/third_party/blink/ Blink 渲染引擎
/v8/ JS 引擎
/skia/ 绘图引擎
/gpu/ GPU 支持
/net/ 网络栈
/mojo/ IPC 框架
/ui/ UI 框架
/base/ 基础库（线程、文件、时间）🧾 九、总结
Chromium 是一个 模块化 + 多进程 + 高安全性 + 高性能 的浏览器架构。
它将网页渲染、安全隔离、硬件加速、网络通信等功能分离，
形成了一套现代软件工程的典范体系。