计算Chrome中渲染进程的个数

559 阅读3分钟

小知识,大挑战!本文正在参与“  程序员必备小知识  ”创作活动

本文同时参与 「掘力星计划」  ,赢取创作大礼包,挑战创作激励金

标签页之间的连接

  1. 通过<a> 标签来和新标签建立连接
<a href="https://time.geekbang.org/" target="_blank" class="">极客时间</a>
  1. 通过 JavaScript 中的 window.open 方法来和新标签页建立连接

以上两种打开标签页的方式,可以在新标签页通过 opener 引用到上一个标签页

把这一类具有相互连接关系的标签页称为浏览上下文组。

Chrome 浏览器会将浏览上下文组中属于同一站点的标签分配到同一个渲染进程中

image.png

rel="noopener noreferrer"

<a target="_blank" rel="noopener noreferrer" class="hover" href="https://linkmarket.aliyun.com/demand?spm=a2c3t.10719541.iot-navBar.60.1aaa51e7W5GQBX" data-spm-anchor-id="a2c3t.10719541.iot-navBar.60">需求广场</a>

并不是所有的打开标签页与原标签页都属于同一个浏览上下文组。

通过设置 rel = "noopener noreferrer" 就可以做到不属于。

将 noopener 的值引入 rel 属性中,就是告诉浏览器通过这个链接打开的标签页中的 opener 值设置为 null,引入 noreferrer 是告诉浏览器,新打开的标签页不要有引用关系。

站点隔离-iframe

标签页中的 iframe 也会遵守同一站点的分配原则,

  1. 标签页里的 iframe 和标签页是同一站点,并且有连接关系,则 iframe 就会和标签页运行在同一渲染进程中。
  2. iframe 和标签页不属于同一站点,那么 iframe 就会运行在单独的渲染进程中。

image.png

同源与同一站点

同源要求协议、域名以及端口均一样才行;

同一站点只要协议、根域名相同就行

这样子相比较下同源的要求比较难满足,通常情况下同一站点就可以保障安全性,并且条件低就更容易满足渲染进程的资源复用,提高性能,减少不必要的开销。

如果 A 标签页和 B 标签页属于同一站点,却不属于同源站点,那么你依然无法通过 opener 来操作父标签页中的 DOM,这依然会受到同源策略的限制。

进程与线程

线程是依附于进程的,而进程中使用多线程并行处理能提升运算效率

  1. 进程中的任意一线程执行出错,都会导致整个进程的崩溃。
  2. 线程之间共享进程中的数据。
  3.  当一个进程关闭之后,操作系统会回收进程所占用的内存。
  4. 进程之间的内容相互隔离。

image.png

最新的 Chrome 浏览器包括:1 个浏览器(Browser)主进程、1 个 GPU 进程、1 个网络(NetWork)进程、多个渲染进程和多个插件进程。

最初的浏览器都是单进程的,它们不稳定、不流畅且不安全,之后出现了 Chrome,创造性地引入了多进程架构,并解决了这些遗留问题。随后 Chrome 试图应用到更多业务场景,如移动设备、VR、视频等,为了支持这些场景,Chrome 的架构体系变得越来越复杂,这种架构的复杂性倒逼 Chrome 开发团队必须进行架构的重构,最终 Chrome 团队选择了面向服务架构(SOA)形式,这也是 Chrome 团队现阶段的一个主要任务。