Chrominum的技术架构

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 是一个 模块化 + 多进程 + 高安全性 + 高性能 的浏览器架构。
它将网页渲染、安全隔离、硬件加速、网络通信等功能分离，
形成了一套现代软件工程的典范体系。

---