程序员最近都爱上了这个网站  程序员们快来瞅瞅吧!  it98k网:it98k.com

本站消息

站长简介/公众号

  出租广告位,需要合作请联系站长


+关注
已关注

分类  

暂无分类

标签  

暂无标签

日期归档  

JavaScript 浏览器多进程、进程与线程的理解,JS运行机制

发布于2021-04-09 07:07     阅读(890)     评论(0)     点赞(19)     收藏(5)


一、区分进程 、线程

1.1 首先官方的定义

进程:

进程 是CPU资源分配的最小单位(是能拥有资源和独立运行的最小单位)

线程:

线程 是CPU调度的最小单位(线程 是建立在 进程 的基础上的一次程序运行单位,一个进程可以有多个线程

1.2 结合例子理解

工厂里有多个车间,每个车间一个或多个员工,每

进程 - - 工厂 ,工厂有独立的资源;工厂之间相互独立;
进程 - - 车间,
线程 - - 车间内每个员工 ,多个员工协作完成任务;员工之间共享车间空间

实际上:

  • 进程里可以有一个或多个进程
  • 一个进程可以有一个()或者多个()线程
  • 不同进程(车间)之间也可以通信,不过代价较大
  • 这提及的 单线程与多线程,都是指在一个进程内的单和多

1.3 前端方向上理解

  • 首先 浏览器 属于多进程 应用程序
      体现在:我们可以打开多个浏览器程序,

  • 浏览器是多进程的
      体现在:一个浏览器程序里可以打开多个 Tab 页面 (就相当于创建了一个独立的浏览器进程)

如图:打开浏览的任务管理器可见,每个标签页都是一个进程。
在这里插入图片描述

二、浏览器包含哪些主要进程

  1. Browser进程:浏览器的主进程(负责协调、主控),只有一个

    负责浏览器页面显示、用户交互(如前进、后退等)
    负责各个页面的管理、创建和销毁其他进程
    将Renderer进程得到的内存中的Bitmap,绘制到用户界面
    网络资源的管理、下载等

  2. 第三方插件进程:每种类型的插件对应一个进程,仅当使用该插件是才创建

  3. GPU(Graphics Processing Unit)进程:最多一个,用于3D绘制

  4. 浏览器渲染进程(浏览器内核)(Renderer进程、内部是多线程的):默认每个Tab 页面一个进程,互不影响。

    主要作用为页面渲染、脚本运行,事件处理等

接下来主要介绍浏览器渲染进程

三、浏览器渲染进程(Renderer/浏览器内核)

牢记:浏览器的渲染进程是多线程的!

3.1 主要包含哪些线程呢?

  1. GUI(Graphical User Interface 图形用户界面)渲染进程

      负责渲染浏览器界面、解析HTML、CSS、构建DOM树和RenderObject树,布局和绘制等。
      当界面需要重绘(Repaint)或者由于某种操作引发回流(reflow)时,该线程会执行
     注意,GUI渲染线程与JS引擎线程是互斥的

  2. JS引擎线程

      也称JS内核,负责处理JavaScript脚本程序;
      JS 引擎线程负责解析 JavaScript脚本、运行代码;
      JS引擎一直等待着任务队列中任务的到来,然后加以处理,一个Tab页(renderer进程)中无论什么时候都只有一个JS线程在运行JS程序。

  3. 事件触发线程

      归属于浏览器而不是JS引擎,用来控制事件循环(可以理解为JS引擎忙不过来,浏览器另开的协助线程);
      当JS引擎执行代码块如setTimeOut时(也可以为来自浏览器内核的其他线程,如鼠标点击,ajax异步请求等),会将对应的任务添加到事件线程中;
      注意JS的单线程关系,所以这些队列中的事件得等到JS引擎空闲时才会排队执行。

  4. 定时触发器线程

     就是 setIntervalsetTimeOut 所在的线程

  5. 异步http请求线程

      在XMLHttpRequest连接后是通过浏览器新开一个线程来请求的;
      将检测到转态变更时,如果没有设置回调函数,异步线程就产生状态变更时间,将这个回调再放入事件队列中,再等JavaScript引擎执行。

四、Browser进程和浏览器渲染进程(浏览器内核/Renderer进程)的通信

  • Browser进程收到用户的请求,首先需要获取页面的内容(譬如通过网络下载资源),随后将该任务通过RendererHost接口传递给Renderer进程

  • Renderer进程的Renderer接口接收到信息、简单解释后,交给渲染进程开始渲染

    渲染进程接收请求,加载网页并渲染网页,这其中可能需要Browser进程获取资源和需要GPU进程进行渲染;
    可能会有JS线程操作DOM(可能会造成回流并重绘);
    最后Render进程将结果传递给Browser进程;

  • Browser进程接收到结果后并将结果绘制出来

五、从EventLoop谈JS执行机制

首先理解一个概念:

  • JS分为同步任务和异步任务
  • 同步任务都在主线程上执行,形成一个执行栈
  • 主线程之外,事件触发线程管理和一个任务队列,只要异步任务(Web APIs)有了运行结果,就在任务队列中放入一个事件
  • 一旦 执行栈 中的 同步任务执行完毕(此时JS引擎空闲),系统EventLoop就会读取任务队列中的事件。

在这里插入图片描述

详细介绍请转此,https://segmentfault.com/a/1190000012925872,非常好的干货!

原文链接:https://blog.csdn.net/Lhy_JL/article/details/115464214




所属网站分类: 技术文章 > 博客

作者:前端大师

链接:http://www.qianduanheidong.com/blog/article/58489/6aa031906b1f79cf888a/

来源:前端黑洞网

任何形式的转载都请注明出处,如有侵权 一经发现 必将追究其法律责任

19 0
收藏该文
已收藏

评论内容:(最多支持255个字符)