看到这里应该就能明白：Chromium 本身已经是一套完整的浏览器工程了。
所以直接把 Chromium 叫成“浏览器内核”，有点像把“一辆汽车”叫成“发动机”。
大家大概知道你想表达什么。但严格来说不是一个东西。
四、那真正的“浏览器内核”是谁？
这里就要引出两个非常重要的名字：
Blink
V8
前端开发者最好把它们记住。
五、Blink 是什么？
Blink 是 Chrome 和 Chromium 使用的网页渲染引擎。
它主要处理什么？简单说：
HTML 和 CSS 主要归它管。
比如浏览器拿到下面这段代码：
<div class="box">
Hello World
</div>
CSS 是：
.box {
width: 200px;
height: 100px;
}
浏览器最终需要知道很多事情。比如：
这是一个 div
它宽 200px
高 100px
它应该出现在页面什么位置
文字应该怎么绘制
元素之间应该怎么布局
这些事情，很大一部分就是 Blink 在负责。过程可以粗略理解成：
HTML
↓
DOM
CSS
↓
CSSOM
DOM + CSSOM
↓
Layout
↓
Paint
↓
Composite
↓
最后显示到屏幕
所以如果有人问：Chrome 的渲染引擎是什么？
答案是：Blink。
六、V8 又是什么？
V8 是 JavaScript 引擎。
它主要负责：执行 JavaScript。
比如：
const a = 1
const b = 2
console.log(a + b)
这段代码不是 Blink 在执行。
主要是 V8。
所以你可以先建立一个最简单的模型：
HTML / CSS
↓
Blink
JavaScript
↓
V8
当然，真实浏览器内部比这个复杂得多。Blink 和 V8 之间也会进行大量交互。但是对于初学者来说，先这样理解完全够用。
七、所以 Chromium、Blink、V8 到底是什么关系？
现在可以把关系画出来了。
Chromium
│
┌─────────┴─────────┐
│ │
Blink V8
│ │
HTML / CSS / DOM JavaScript
注意这里的层级关系。不是：
也不是：
而是：
Chromium 里面使用了 Blink 和 V8
Chromium 比这两个东西都大得多。
八、Chrome 又处在哪一层？
再往上放一层。
Chrome
│
Google 产品和服务
│
Chromium
│
┌────────┴────────┐
│ │
Blink V8
这就比较接近真实关系了: Chrome 基于 Chromium。但是 Chrome 并不等于 Chromium。
Google 会在 Chromium 的基础上增加很多自己的产品能力。
比如：
Google 账号
Chrome Sync
Google Password Manager
自动更新
Safe Browsing
企业管理功能
一些 Google 服务
Google 自己的产品功能
所以，如果你自己下载 Chromium 源码编译一个浏览器出来，它不会和你从 Chrome 官网下载安装的 Chrome 完全一样。
九、Edge 为什么也和 Chrome 很像？
因为新版 Edge 也是基于 Chromium 开发的。大概可以理解成：
Chromium
│
┌────────────┴────────────┐
│ │
Chrome Edge
│ │
Google Microsoft
│ │
Google 服务 Microsoft 服务
底层很多东西是一样的。比如：
Blink
V8
网络模块
多进程架构
很多 Web API
DevTools 的大量基础能力
所以前端开发的时候经常会发现：
一个网页在 Chrome 上正常，在 Edge 上通常也不会有太大问题。
因为它们底层共享了大量 Chromium 代码。当然，这不代表 Chrome 和 Edge 完全一样。微软依然会加入自己的：
账号系统
UI
Copilot
收藏夹能力
企业管理
隐私策略
浏览器功能
所以更准确的说法是：
Chrome 和 Edge 使用了相同的 Chromium 底座，但上层产品不同。
十、Safari 和 Firefox 呢？
Safari 和 Firefox 就不是 Chromium 这一套了。
现在主流浏览器大致可以这样看：
所以现在主流浏览器大体上可以看成几个阵营。
浏览器
│
├── Chromium / Blink
│ ├── Chrome
│ ├── Edge
│ ├── Brave
│ └── Opera
│
├── WebKit
│ └── Safari
│
└── Gecko
└── Firefox
这也是为什么前端开发者做浏览器兼容测试的时候，通常不能只测 Chrome。最好至少关注：
Chrome / Edge
Safari
Firefox
因为它们并不完全使用同一套浏览器实现。
十一、为什么 Chrome 里还有一堆 webkit？
前端开发者应该都见过这种代码：
-webkit-transform: translateX(10px)；
或者：
看到这里很多人都会奇怪: Chrome 不是 Blink 吗？为什么名字里面还有 webkit？
这是一个历史遗留问题, Blink 和 WebKit 本来就有血缘关系。历史可以非常粗略地画成：
Chrome 早期使用的就是 WebKit。后来 Google 在 2013 年从 WebKit 中分出了 Blink。从那以后：
Safari
↓
WebKit
Chrome
↓
Blink
但是很多历史兼容代码并没有马上消失。所以今天的 Chrome 里面依然能看到大量 webkit 这个名字。
这不是因为 Chrome 今天仍然直接使用 WebKit。更多是历史兼容问题。
十二、Chrome 其实不是“一个程序”
这里再多往底层走一步, 很多人会潜意识认为：
实际上，现代 Chrome 是一个典型的多进程浏览器。你打开 Chrome 的任务管理器，就会看到很多进程。大概像这样：
Browser Process
│
├── Renderer Process
├── Renderer Process
├── GPU Process
├── Network Service
├── Extension Process
└── Utility Process
也就是说，Chrome 不是什么事情都塞进一个进程。比如网页渲染，通常会运行在 Renderer Process 里面。网络有自己的服务, GPU 有自己的进程, 扩展也可能运行在独立进程。
这么设计有很多好处。最直观的一点就是：
某一个网页崩了，不一定把整个浏览器一起带崩。
比如：
Renderer A 💥
Renderer B 正常
Renderer C 正常
Browser 正常
现代浏览器能做到比较好的稳定性和安全性，多进程架构是一个很重要的原因。
十三、再回头看 Chrome DevTools
平时我们按 F12 打开的 Chrome DevTools，其实就是观察 Chromium 各种能力的一个窗口。
比如：
Elements
背后会涉及 DOM、CSS、Blink。
大量能力和 JavaScript、V8 有关。
对应 Chromium 的网络模块。
会涉及：
Blink
V8
Renderer
GPU
页面布局
绘制
Application
里面又会看到：
Cookie
LocalStorage
IndexedDB
Cache Storage
Service Worker
所以前端开发者其实每天都在和 Chromium 打交道, 只是平时没有特意去想这些东西叫什么。
十四、最后做一次总结
如果前面的内容感觉有点多，最后只需要记住下面四句话。
第一，Chromium
Chromium 是：
Google 发起并长期主导的开源浏览器工程。
它不是简单的“渲染内核”, 而是包含了构建现代浏览器需要的大量基础设施。
第二，Chrome
Chrome 是：
Google 基于 Chromium 打造的浏览器产品。
可以简单理解成：
Chrome
=
Chromium
+
Google 的产品能力
第三，Blink
Blink 是：
Chromium 使用的网页渲染引擎。
主要负责：
第四，V8
V8 是：
Chromium 使用的 JavaScript 引擎。
主要负责执行：
最终关系可以画成这样：
Chrome
│
Google 产品层
│
Chromium
│
┌────────────────┼────────────────┐
│ │ │
Blink V8 其他模块
│ │ │
HTML / CSS / DOM JavaScript Network
GPU
Storage
Sandbox
DevTools
多进程架构
...
以后再听到“Chrome 内核”“Chromium 内核”这种说法时，就可以先问自己一句：
对方说的到底是 Chromium，Blink，还是 V8？
把这几个概念分开之后，很多浏览器相关的问题都会一下子清楚很多。
阅读原文：点击这里
400 186 1886
