<aside> 📌 本篇原文发表于 2018.09.05，正文中出现的有关于时间概念的句子或词语，请读者注意切换语境。另外，文章是中英双语对照的，想看原文的小伙伴也可以同时阅读原文，如有翻译歧义或者有误之处，还请慷慨指出🤓。 👉🏻原文链接

</aside>

• 目录大纲

中央处理器/图形处理器/内存/多进程架构

• 在这个包含 4 篇文章的博客系列中，我们将从高阶架构到具体的渲染细节来深入 Chrome 浏览器内部了解其是怎么运作的。如果你曾经好奇浏览器是怎么把代码转变成一个功能齐备的网站，或者你并不确定为什么一个具体的技术细节能够带来性能提升，那么这个系列正好是为你准备的。

• 作为系列第一篇，我们将会了解一些核心的计算机术语和 Chrome 浏览器的多进程架构。

• 如果你对 CPU/GPU 和 进程/线程已经很熟悉，可以直接跳到 浏览器架构 章节。

计算机的核心 - CPU 和 GPU

• 为了理解浏览器所运行的环境，我们需要先了解计算机的一些部件以及它们是做什么的。

中央处理器 CPU

• 首先是中央处理器（CPU, Central Processing Unit）。CPU 可以被看作是一台计算机的大脑，一个 CPU 内核可以想象成一位办公室工作人员，能够处理一个接一个被安排的多个任务，可以处理一切从数学甚至到艺术领域的难题，而且它知道如何去响应一个用户的指令。以前的大多数 CPU 都是单个芯片，一个内核就相当于是一个 CPU 被嵌入到一个芯片上。在现代的硬件条件下，出现了多核处理器，也赋予了手机、笔记本更强的计算能力。

图 1：四个 CPU 内核就像彼此相邻的办公室职员一样处理多个任务

图形处理器 GPU

• 图形处理器是计算机里的另一个部件。和 CPU 不同的是，GPU 更擅长在多核之间处理一些简单的任务。顾名思义，GPU 最初是被开发成处理图形任务的模块，这也是为什么在很多图形计算的背景下，会把“使用 GPU”或“支持 GPU”和快速渲染、流畅的交互体验相关联在一起。近些年来，有了 GPU 加速的计算能力，也使 GPU 独立承载越来越多的计算成为可能。

图2：多个带着扳手🔧️的 GPU 内核，表明它们只能处理有限的任务

• 当你在手机或电脑上启动一个应用时，是 CPU 和 GPU 在给应用提供运行能力。通常情况下，操作系统提供了一套运行机制供应用程序在 CPU 和 GPU 运行。

图 3: 计算机的三层架构示意图；机械硬件在最底层，操作系统在中间层，应用程序在最上层。

在进程和线程里执行程序

图 4: 进程就像一个鱼缸，线程就像鱼儿🐟️在鱼缸里游泳🏊🏻‍♀️