浏览器渲染引擎线程和js执行引擎线程的关系

总论

1、js一个tab就是一个进程，这个tab下会有多个线程，主要是主线程、渲染线程、js线程、网络线程资源池；

2、js引擎线程通过dom 之类的api和渲染线程沟通和控制渲染线程的一些页面显示；

3、实际上权威的说法是js引擎和渲染都是在一个线程上执行的，通过dom api之类的沟通，都是在主线程上执行。

从上图看出渲染、绘制、js执行都是在主线程上执行的。

4、gpt解释如下:

浏览器tab进程执行网页大概过程

1、先用网络线程请求静态资源，css\html\js 这些资源，如果都是同步请求的话，最好js放在页面底部并另外文件存放，这样html资源请求好后会先渲染页面，不用等js资源。如果js资源放在顶部header的话且同步请求，那js资源会阻塞页面渲染，推迟一点点页面渲染时间。

2、如果html被渲染引擎渲染了，底部引入的js文件资源也会在后台同步获取。

3、一般渲染线程执行的时候，js执行线程会暂停，反之亦然。

4、接着执行js同步任务

5、事件循环队列等待新任务执行。

其他：

在现代浏览器中，JavaScript的执行引擎（JS引擎）和渲染线程是协调工作的。它们处于同一进程中，但在大多数情况下，它们不会同时工作。具体来说，当JavaScript执行引擎正在运行JavaScript代码时，渲染线程通常会暂停，反之亦然。

网络线程一般是个资源池，多个tab栏共享，所以有时候对文件进行切片实现并发上传文件资源。

放在header头部的js资源也可以加入defer等异步标识，让后面的html渲染资源先执行。

js引擎线程和渲染线程关系示意图