共计 3019 个字符,预计需要花费 8 分钟才能阅读完成。
CPU、GPU、内存和多过程架构
在这个由 4 局部组成的博客系列中,咱们将深刻理解 Chrome 浏览器,从高级架构到渲染管道的细节。如果您想晓得浏览器如何将您的代码变成功能性网站,或者您不确定为什么倡议应用特定技术来进步性能,那么本系列适宜您。
作为本系列的第 1 局部,咱们将理解外围计算术语和 Chrome 的多过程架构。
计算机的外围是 CPU 和 GPU
CPU
首先是中央处理器(CPU
),CPU
能够被视为计算机的大脑。一个 CPU
内核,在计算机硬件方面指处理器的外部外围,包装在一个元件中的独立处理单元 ,在这里被描绘成一个办公室工作人员,能够一个接一个地解决许多不同的工作,它能够解决从数学到艺术的所有工作,同时晓得如何回复客户电话。在过来,大多数CPU
都是单芯片,但在古代硬件中,为了给您的手机和笔记本电脑提供更多的计算能力,通常会取得多个内核。如何了解处理器、CPU、多处理器、内核、多核?
图 1:4 个 CPU
内核作为办公室工作人员坐在每张办公桌前解决进来的工作
GPU
图形处理器(GPU
)是计算机的另一部分,与 CPU
不同,GPU
善于矩阵计算,像素解决,它最后是为解决图形而开发的 。这就是为什么在图形环境中应用GPU
与疾速渲染和平滑交互无关。近年来,随着 GPU
减速计算,越来越多的计算在 GPU
上成为可能。
图 2:许多带有扳手的 GPU
内核表明它们只能解决无限的工作
当您在计算机或手机上启动应用程序时,CPU
和 GPU
为应用程序提供能源。通常,应用程序应用操作系统提供的机制在 CPU
和GPU
上运行。
图 3:三层计算机架构。机器硬件在底部,操作系统在两头,应用程序在顶部。
过程和线程
在深入研究浏览器架构之前,须要把握的另一个概念,过程和线程。过程能够被形容为应用程序的执行程序,线程是位于过程外部并执行其过程程序的任何局部的线程。
图 4:过程作为边界框,线程作为形象的鱼在过程内游动
启动应用程序时,将创立一个过程,程序可能会创立线程来帮忙它工作,但这是可选的。操作系统为过程提供了一块“平板”内存,所有应用程序状态都保留在该公有内存空间中。敞开应用程序时,过程也会隐没,操作系统会开释内存。
图 5:应用内存空间和存储应用程序数据的过程图
一个过程能够要求操作系统启动另一个过程来运行不同的工作。产生这种状况时,会为新过程调配不同的内存局部。如果两个过程须要对话,它们能够应用过程间通信(IPC
)进行对话。许多应用程序都是这样设计的,因而,如果工作过程没有响应,则能够重新启动,而不影响其余应用程序过程运行。
图 6:通过 IPC
进行通信的独立过程示意图
浏览器架构
那么如何应用过程和线程构建 Web
浏览器呢?它可能是一个具备许多不同线程的单过程架构,也可能有许多不同过程的多过程架构,其中有几个线程通过 IPC
进行通信。
图 7:过程 / 线程图中的不同浏览器架构
这儿须要留神这些不同架构的实现细节,并没有对于如何构建 Web
浏览器的标准规范,一种浏览器的架构设计可能与另一种齐全不同。
为了这个博客系列,咱们将应用下图中形容的 Chrome
最新架构。
顶部是浏览器过程与解决应用程序不同局部的其余过程协调。对于渲染器过程,每创立一个选项卡都会一个渲染器过程。当初,Chrome
在为每个选项卡提供了一个渲染器过程的同时,也尝试为每个选项卡内嵌套的站点(iframe
)提供本人的过程(请参阅站点隔离)。
图 8:Chrome
的多过程架构图。渲染器过程下显示了多个层,以示意 Chrome 为每个选项卡运行多个渲染器过程。
各类过程的职责
下表形容了每个 Chrome
过程及其管制的内容:
Browser Process
负责整个浏览器内行为协调,调用各个过程模块Renderer Process
负责网站选项卡内的内容显示。Plugin Process
负责解决各类浏览器插件GPU Process
负责绘图
图 9:指向浏览器 UI
不同局部的不同过程
还有更多过程,例如 Extension process
和utility process
。如果您想查看 Chrome
中正在运行的过程数量,请单击右上角的选项菜单图标more_vert
,抉择更多工具,而后抉择工作管理器。这将关上一个窗口,其中列出了以后正在运行的过程以及它们正在应用多少 CPU
/ 内存。
Chrome 多过程架构的益处
之前,我提到 Chrome
应用多个渲染器过程。在最简略的状况下,您能够设想每个选项卡都有本人的渲染器过程。假如您关上了 3 个选项卡,每个选项卡都由一个独立的渲染器过程运行。如果一个选项卡变得无响应,那么您能够敞开无响应的选项卡并继续前进,同时放弃其余选项卡处于活动状态。如果所有选项卡都在一个过程上运行,则当一个选项卡无响应时,所有选项卡均无响应,这很可怕。
图 10:显示运行每个选项卡的多个过程的图表
将浏览器的工作分成多个过程的另一个益处是安全性和沙盒。因为操作系统提供了一种限度过程权限的办法,因而浏览器能够对某些过程的某些性能进行沙箱解决。
因为过程有本人的公有内存空间,它们通常蕴含通用基础设施的正本(例如 V8
,它是 Chrome
的 JavaScript
引擎)。这意味着更多的内存应用,因为它们不能像在同一过程中的线程那样共享。为了节俭内存,Chrome
限度了它能够启动的过程数。限度取决于您的设施领有多少内存和 CPU
能力,然而当 Chrome
达到限度时,它会开始在一个过程中运行来自同一站点的多个选项卡。
单 / 多过程弹性架构,节俭更多内存
雷同的办法实用于浏览器过程。Chrome
正在经验架构更改,以将浏览器程序的每个局部作为服务运行,从而能够轻松拆分为不同的过程或聚合为一个。
个别的想法是,当 Chrome
在弱小的硬件上运行时,它可能会将每个服务拆分为不同的过程以提供更高的稳定性,但如果它在资源受限的设施上,Chrome
会将服务整合到一个过程中以节俭内存占用。在此更改之前,已在 Android
等平台上应用了相似的整合流程以缩小内存应用的办法。
图 11:Chrome
服务化示意图,将不同的服务挪动到多个过程和单个浏览器过程中
站点隔离
站点隔离是 Chrome
中最近引入的一项性能,它为每个跨站点 iframe
调配独自的渲染器过程。咱们始终在探讨每个选项卡对应一个渲染器过程,如果容许多个跨站点 iframe
在单个渲染器过程中运行,并在不同站点之间共享内存空间,在同一个渲染器过程中运行 a.com
和 b.com
仿佛没有什么问题。但随着 Meltdown 和 Spectre 破绽的呈现,很显著促使咱们须要应用过程来分隔站点。自 Chrome 67
起,默认状况下在桌面上启用站点隔离,选项卡中的每个跨站点 iframe
都会取得一个独自的渲染器过程。
图 12:场地隔离示意图;指向站点内 iframe
的多个渲染器过程
启用站点隔离是一项经验多年才实现的工作,站点隔离并不仅仅像调配不同的渲染器过程那么简略,它从根本上扭转了 iframe
互相通信的形式。在不同过程上运行 iframe
的页面上关上 devtools
意味着 devtools
必须做很多幕后工作以使其看起来无缝,即便运行一个简略的 Ctrl+F
在页面中查找单词也意味着在不同的渲染器过程中进行搜寻。您能够看到浏览器工程师将 Site Isolation
的公布称为重要里程碑的起因!
总结
在这篇文章中,咱们介绍了浏览器架构,并介绍了多过程架构的益处。咱们还介绍了与多过程架构密切相关的 Chrome 中的服务化和站点隔离。在下一篇文章中,咱们将开始深入研究这些过程和线程之间产生的事件