脚本宝典收集整理的这篇文章主要介绍了JS(单线程)与浏览器(多进程),脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
CPU是计算机的核心,承担所有的计算任务
进程 字面意思就是 进行中的程序,可以理解为 一个可以独立运行且拥有自己的资源空间的任务程序
进程包括 运行中的程序 和 程序所使用到的内存和系统资源。当我们启动某个程序时,操作系统会给该程序创建一块内存(当程序关闭时,该内存空间就会被回收),用来存放代码、运行中的数据和一个执行任务的主线程,这样的一个运行环境就叫进程。
多个进程: CPU可以有很多进程,我们的电脑每打开一个软件就会产生一个或多个进程,为什么电脑运行的软件多就会卡,是因为CPU给每个进程分配资源空间,但是一个CPU一共就那么多资源,分出去越多,越卡,每个进程之间是相互独立的,CPU在运行一个进程时,其他的进程处于非运行状态,CPU使用 时间片轮转调度算法 来实现同时运行多个进程
2、线程: 线程是CPU调度的最小单位
线程是建立在进程的基础上的一次程序运行单位,通俗点解释线程就是程序中的一个执行流,一个进程可以有多个线程
因此,线程是依附于进程的,在进程中使用多线程并行处理能提升运算效率,进程将任务分成很多细小的任务,再创建多个线程,在里面并行分别执行
3、进程和线程的区别和关系:
区别:
关系:
4、多进程和多线程:
多进程: 多进程指的是在同一个时间里,同一个计算机系统中如果允许两个或两个以上的进程处于运行状态。
多线程: 多线程是指程序中包含多个执行流,即在一个程序中可以同时运行多个不同的线程来执行不同的任务,也就是说允许单个程序创建多个并行执行的线程来完成各自的任务
JS的单线程,与它的用途有关。作为浏览器脚本语言,JavaScript的主要用途是与用户互动,以及操作DOM。这决定了它只能是单线程,否则会带来很复杂的同步问题。比如,假定JavaScript同时有两个线程,一个线程在某个DOM节点上添加内容,另一个线程删除了这个节点,这时浏览器应该以哪个线程为准,因此这是一个矛盾点,是JS的功能决定了它是单线程语言。
还有人说JS还有Worker线程,为了利用多核CPU的计算能力,HTML5提出Web Worker标准,允许JavaScript脚本创建多个线程,但是 子线程是完全受主线程控制的,而且不得操作DOM
所以,这个标准并没有改变 JavaScript是单线程的本质
详情请了解:JS运行机制
浏览器是多进程的,拿Chrome来说,每打开一个Tab页就会产生一个进程,使用Chrome打开很多标签页不关,电脑会越来越卡,这是因为消耗了其CPU的缘故。
浏览器包含哪些进程:
Chorme浏览器从关闭到启动,然后新开一个页面至少需要:1个浏览器进程,1个GPU进程,1个网络进程,和1个渲染进程,一共4个进程。
后续如果再打开新的标签页:浏览器进程,GPU进程,网络进程是共享的,不会重新启动,然后默认情况下会为每一个标签页配置一个渲染进程,但是也有例外,比如从A页面里面打开一个新的页面B页面,而A页面和B页面又属于同一站点的话,A和B就共用一个渲染进程,其他情况就为B创建一个新的渲染进程
所以,最新的Chrome浏览器包括:1个浏览器主进程,1个GPU进程,1个网络进程,多个渲染进程,和多个插件进程
1、浏览器进程:
2、GPU进程:
Chrome刚开始发布的时候是没有GPU进程的,而使用GPU的初衷是为了实现3D、CSS效果,只是后面网页、Chrome的UI界面都用GPU来绘制,这使GPU成为浏览器普遍的需求,最后Chrome在多进程架构上也引入了GPU进程
3、网络进程:
以前是作为模块运行在浏览器进程一时在面的,后面才独立出来,成为一个单独的进程
4、插件进程:
因为插件可能崩溃,所以需要通过插件进程来隔离,以保证插件崩溃也不会对浏览器和页面造成影响。
每种类型的插件对应一个进程,当使用该插件时才创建。
5、渲染进程(Renderer):
平时看到的浏览器呈现出页面过程中,大部分工作都是在渲染进程中完成
1、GUI渲染线程
1)负责渲染页面,解析 html 和 css、构建DOM树、CSSOM树、渲染树、布局和绘制页面等
2)当页面需要Repaint和Reflow时,GUI线程将要执行,绘制页面
3)GUI渲染线程与JS引擎线程是互斥的
2、JS引擎线程
浏览器同时只能有一个JS引擎线程在运行JS程序,所以JS是单线程运行的
注意:GUI渲染线程与JS引擎线程是互斥的,JS引擎线程会阻塞GUI渲染线程
常遇到的问题: JS执行时间过长,造成页面的渲染不连贯,导致页面渲染加载阻塞(就是加载慢)
例如:浏览器渲染的时候遇到<script>
标签,就会停止GUI的渲染,然后JS引擎线程开始工作,执行里面的JS代码,等JS执行完毕,JS引擎线程停止工作,GUI继续渲染下面的内容。所以如果JS执行时间太长就会造成页面卡顿的情况。
3、定时触发器线程
即为setInterval与setTimeout所在线程
4、异步http请求线程
即在XMLHttPRequest在连接后是通过浏览器新开一个线程请求
5、事件触发线程
1、进程模型:
2、线程模型:
每一个Chrome的线程,入口函数都差不多,都是启动一个消息循环,等待并执行任务
没有办法直接通信,需要有一个类似中介者进行消息的转发和接收,比如
localStorage: 在一个标签页监听localStorage的变化,然后当另一个标签页修改的时候,可以通过监听获取新数据
cookie + setInterval: 在A页面将需要传递的信息存储在cookie中,在B页面设置setInterval,以一定的时间去读取cookie的值
WebSocket: 因为websocket可以实现实时服务器推送,所以服务器就可以来当这个中介者。标签页通过向服务器发送数据,然后服务器再向其他标签推送转发
ShareWorker: 会在页面的生命周期内创建一个唯一的线程,并开启多个页面也只会使用同一个线程,标签页共享一个线程
postMessage:
// 发送方
window.parent().postMessage('发送的数据','http://接收地址')
// 接收方
window.addEventListener(';message',(e)=>{ let data = e.data })
拓展知识:
孤儿进程: 故名思义,就是没爹的孩子。父进程退出了,而它的一个或多个进程还在运行,那么这些子进程都会成为孤儿进程。这些孤儿都将被init进程收养,并负责这些孤儿的以后
僵尸进程: 就是子进程比父进程先结束,而父进程又没有释放子进程占用的资源,那么子进程的描述还留在系统中,这种进程就是僵尸进程
参考优秀文章:
「硬核JS」一次搞懂JS运行机制
深入理解浏览器中的进程与线程
以上是脚本宝典为你收集整理的JS(单线程)与浏览器(多进程)全部内容,希望文章能够帮你解决JS(单线程)与浏览器(多进程)所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。