Open JTangming opened 3 years ago
注，下文大致意译至 inside-browser-part1
在接下来的4个 blog 系列里边，将探索 Chrome 浏览器的底层架构和渲染管道细节，旨在弄明白从代码转换成可视化界面的过程，以此来写出更优秀性能的网站或应用。
本文是该系列的第一遍，我们先了解一些关键的计算机术语以及 Chrome 浏览器的多进程架构。
想要理解浏览器的运行环境，首先要搞明白计算机的一些核心概念以及它们的作用。
CPU 即 Central Processing Unit，可以理解成计算机的大脑。CPU core 可以想象成办公室里的工人，精通天文地理琴棋书画，可以串行地一件接着一件处理交给它的任务。现在的硬件设备多以多核为主，具备更优的计算性能。
图形处理器 GPU（Graphics Processing Unit）是计算机的另一组成部分，能通过多核处理简单的任务，这样就具备了极强的计算能力。GPU 顾名思义就是用来处理图形的，在说到图形 useing GPU 或 GPU backed 时，人们就会联想到图形快速渲染或者流畅的用户体验相关的概念。最近几年来，随着 GPU 加速概念的流行，在 GPU 上单独进行的计算也变得越来越多了。
在手机或者电脑上打开某个应用程序时，背后其实是 CPU 和 GPU 支撑着这个应用程序的运行。
在往下了解前，先理解清楚进程和线程的概念。进程可以看成是正在执行的应用程序，而线程则是跑在进程里面的，一个进程可以有一个或者多个线程，这些线程可以执行任何一部分应用程序的代码。
在启动一个应用程序后，操作系统将会为这个程序创建一个进程同时还为这个进程分配一片私有的内存空间，这片空间会被用来存储所有程序相关的数据和状态。当关闭程序，这个程序对应的进程也会随之消失，进程对应的内存空间也会被操作系统回收掉。
而在应用程序中，为了满足功能的需要，进程会创建其它新的进程来处理其他任务，这些创建出来的新进程拥有全新独立的内存空间，不能与原来的进程共享内存，很多应用程序都会采取这种多进程的方式来工作，因为进程和进程之间是互相独立的它们互不影响。如果这些进程之间需要通信，可以通过IPC机制（Inter Process Communication）来进行。
那么浏览器是怎么使用进程和线程的呢？一种可能是单进程配合多个线程工作，另一种是启动多进程，每个进程里面有一些线程，不同进程通过 IPC 进行通信。
上图架构基本包含了浏览器架构的具体实现，但在现实中并没有一个标准化的浏览器实现标准，不同浏览器的实现方式可能会完全不一样，注，下文以 Chrome 浏览器为例，介绍浏览器的多进程架构。
在 Chrome 中，主要的四个进程为：
这4个进程之间的关系是什么呢？我们从浏览器的地址栏里输入 URL 后点击回车说起。
通过将和浏览器本身（Chrome）相关的部分拆分为一个个不同的服务或聚合为一个进程。如果 Chrome 应用运行在高性能的硬件上，则相关进程服务放到不同的进程运行以提高系统的稳定性，反之，则放在同一个进程里面执行来减少内存的占用。
Chrome 为不同的跨站 iframe 启用不同的渲染引擎。同源策略是浏览器最核心的安全模型，而进程隔离是隔离网站最有效的办法了，再加上 CPU 存在 Meltdown and Spectre 的隐患，网站隔离变得势在必行。
在 Chrome 67 版本之后支持了该特性
理解了概念之后，后边的文章我们将开始研究这些进程和线程之间发生了什么，如何显示一个网站内容。
CPU，GPU，内存和多进程架构
在接下来的4个 blog 系列里边，将探索 Chrome 浏览器的底层架构和渲染管道细节，旨在弄明白从代码转换成可视化界面的过程，以此来写出更优秀性能的网站或应用。
本文是该系列的第一遍，我们先了解一些关键的计算机术语以及 Chrome 浏览器的多进程架构。
CPU和GPU
想要理解浏览器的运行环境，首先要搞明白计算机的一些核心概念以及它们的作用。
CPU
CPU 即 Central Processing Unit，可以理解成计算机的大脑。CPU core 可以想象成办公室里的工人，精通天文地理琴棋书画，可以串行地一件接着一件处理交给它的任务。现在的硬件设备多以多核为主，具备更优的计算性能。
GPU
图形处理器 GPU（Graphics Processing Unit）是计算机的另一组成部分，能通过多核处理简单的任务，这样就具备了极强的计算能力。GPU 顾名思义就是用来处理图形的，在说到图形 useing GPU 或 GPU backed 时，人们就会联想到图形快速渲染或者流畅的用户体验相关的概念。最近几年来，随着 GPU 加速概念的流行，在 GPU 上单独进行的计算也变得越来越多了。
在手机或者电脑上打开某个应用程序时，背后其实是 CPU 和 GPU 支撑着这个应用程序的运行。
进程和线程上执行程序
在往下了解前，先理解清楚进程和线程的概念。进程可以看成是正在执行的应用程序，而线程则是跑在进程里面的，一个进程可以有一个或者多个线程，这些线程可以执行任何一部分应用程序的代码。
在启动一个应用程序后，操作系统将会为这个程序创建一个进程同时还为这个进程分配一片私有的内存空间，这片空间会被用来存储所有程序相关的数据和状态。当关闭程序，这个程序对应的进程也会随之消失，进程对应的内存空间也会被操作系统回收掉。
而在应用程序中，为了满足功能的需要，进程会创建其它新的进程来处理其他任务，这些创建出来的新进程拥有全新独立的内存空间，不能与原来的进程共享内存，很多应用程序都会采取这种多进程的方式来工作，因为进程和进程之间是互相独立的它们互不影响。如果这些进程之间需要通信，可以通过IPC机制（Inter Process Communication）来进行。
浏览器架构（Browser Architecture）
那么浏览器是怎么使用进程和线程的呢？一种可能是单进程配合多个线程工作，另一种是启动多进程，每个进程里面有一些线程，不同进程通过 IPC 进行通信。
上图架构基本包含了浏览器架构的具体实现，但在现实中并没有一个标准化的浏览器实现标准，不同浏览器的实现方式可能会完全不一样，注，下文以 Chrome 浏览器为例，介绍浏览器的多进程架构。
各个进程如何分工协作的？
在 Chrome 中，主要的四个进程为：
这4个进程之间的关系是什么呢？我们从浏览器的地址栏里输入 URL 后点击回车说起。
Chrome 多进程架构的好处
多进程架构优化
节省内存（Servicification）
通过将和浏览器本身（Chrome）相关的部分拆分为一个个不同的服务或聚合为一个进程。如果 Chrome 应用运行在高性能的硬件上，则相关进程服务放到不同的进程运行以提高系统的稳定性，反之，则放在同一个进程里面执行来减少内存的占用。
单帧渲染进程（Site Isolation）
Chrome 为不同的跨站 iframe 启用不同的渲染引擎。同源策略是浏览器最核心的安全模型，而进程隔离是隔离网站最有效的办法了，再加上 CPU 存在 Meltdown and Spectre 的隐患，网站隔离变得势在必行。
总结
理解了概念之后，后边的文章我们将开始研究这些进程和线程之间发生了什么，如何显示一个网站内容。