线程



1.GUI渲染线程(一个)

2.JS引擎线程(一个)

3.事件触发线程

4.定时器触发线程(多个)

5.异步http请求线程（多个）

线程执行

页面加载时

GUI渲染引擎和JS执行引擎互斥，当GUI渲染引擎解析html处理到script标签，会立即挂起解析html的任务，然后开始解析js代码，这里就是执行一个宏任务。直到所有这个宏任务执行完成后，继续执行html解析渲染

JS是单线程指的是执行引擎是单线程

宏任务微任务

宏任务是由宿主发起的，而微任务由JavaScript自身发起。

Event loop

JS是基于事件驱动的，其需要一种事件循环机制和来进行线程的配合

js执行引擎（主线程）在空闲时判断是否有未执行的微任务，有则一个个将微任务中的回调函数放到主线程中执行，直到微任务队列清空；微队列清空后判断宏任务队列

https://zhuanlan.zhihu.com/p/165950721?utm_source=wechat_session&utm_medium=social&utm_oi=930814167984668672&utm_campaign=shareopn

浏览器渲染与event loop的更多相关文章

  1. 浏览器中的 Event Loop

    当我们执行 JS 代码的时候其实就是往执行栈中放入函数,那么遇到异步代码的时候该怎么办?其实当遇到异步的代码时,会被挂起并在需要执行的时候加入到 Task(有多种 Task) 队列中.一旦执行栈为空, ...

  2. js 在浏览器中的event loop事件队列

    目录 前言 认识一个栈两个队列 执行过程 异步任务怎么分配 简单例子 难一点的例子 前言 以下内容是js在浏览器中的事件队列执行,与在nodejs中有所区别,请注意. 都说js是单线程的,不过它本身其 ...

  3. 浏览器与Node的事件循环(Event Loop)有何区别?

    前言 本文我们将会介绍 JS 实现异步的原理,并且了解了在浏览器和 Node 中 Event Loop 其实是不相同的. 一.线程与进程 1. 概念 我们经常说 JS 是单线程执行的,指的是一个进程里 ...

  4. [转]Event loop——浏览器和Node区别

    最近对Event loop比较感兴趣,所以了解了一下.但是发现整个Event loop尽管有很多篇文章,但是没有一篇可以看完就对它所有内容都了解的文章.大部分的文章都只阐述了浏览器或者Node二者之一 ...

  5. Event Loop详解

    1.进程,单线程与多线 进程: 运行的程序就是一个进程,比如你正在运行的浏览器,它会有一个进程. 线程: 程序中独立运行的代码段. 一个进程由单个或多个线程组成,线程是负责执行代码的. 2.单线程与多 ...

  6. js的事件循环（Event Loop）

    (本文从掘金小册整理) 首先介绍一下几个概念 进程与线程 相信大家经常会听到 JS 是单线程执行的,但是你是否疑惑过什么是线程? 讲到线程,那么肯定也得说一下进程.本质上来说,两个名词都是 CPU 工 ...

  7. HTML Standard系列：Event loop、requestIdleCallback 和 requestAnimationFrame

    HTML Standard系列:Event loop.requestIdleCallback 和 requestAnimationFrame - 掘金 https://juejin.im/post/5 ...

  8. JS的Event Loop

    JavaScript是单线程的,只有一个执行栈,一次只能做一件事. 在浏览器中,却“好像”可以同时做几件事:点击,发送请求,执行多个函数,解析代码. 这是因为浏览器实现的Event Loop机制. W ...

  9. 从event loop规范探究javaScript异步及浏览器更新渲染时机

    异步的思考 event loops隐藏得比较深,很多人对它很陌生.但提起异步,相信每个人都知道.异步背后的“靠山”就是event loops.这里的异步准确的说应该叫浏览器的event loops或者 ...

  10. 浏览器组成、线程及event loop

    浏览器组成 User interface: a. Every part of the browser display, except the window. b. The address bar, b ...

随机推荐

  1. SpringBoot 整合Seccurity、权限管理

    Spring Boot 整合Spring Seccurity 1.创建maven工程 <?xml version="1.0" encoding="UTF-8&quo ...

  2. kali linux 使用教程

    kali linux使用教程 前言:Kali Linux 是专门用于渗透测试的linux操作系统,它由BackTrack发展而来,在整合了IWHAX.WHOPPIX和Auditor这三种渗透测试专用L ...

  3. Cesium计算范围(十三)

    function bounds(positions = [], expand = 0) { let minLng = 180 let minLat = 90 let maxLng = -180 let ...

  4. JZOJ 3234. 阴阳

    阴阳 题面 分析 个人认为是极好的题,很容易写 如果你学点分治是无奈背板的,那就做做这道题,加深你对点分治的理解 一般的,处理树上大规模统计问题,我们分治的关键是找一棵子树的重心 找到分治中心,即新一 ...

  5. JZOJ 5351. 【NOIP2017提高A组模拟9.7】简单无向图

    题目大意 给定 \(n\) 个度数为 \(\in [1,2]\) 之间的点,求能组成多少种简单无向图(可不连通,点与点之间有别) 分析 显然答案只与 \(n1,n2\) 有关 那么 \(dp\)?(我 ...

  6. Linux：grep 查找文件内容

    在 Windows 中打开文件用查找功能可以查找我们想要的字符,前提是要打开文件.Linux 有一个指令不用打开文件就可以查询字符,而且支持正则表达式-- grep 指令.不仅如此,grep 还支持在 ...

  7. 一文搞懂│http 和 https 的通信过程及区别

    目录 两者的区别 HTTP的通信过程 HTTPS的通信过程 两者的区别 端口: http 端口号是80,https 端口号是443 传输协议: http 是超文本传输协议,属于明文传输:https 是 ...

  8. Optimum + ONNX Runtime: 更容易、更快地训练你的 Hugging Face 模型

    介绍 基于语言.视觉和语音的 Transformer 模型越来越大,以支持终端用户复杂的多模态用例.增加模型大小直接影响训练这些模型所需的资源,并随着模型大小的增加而扩展它们.Hugging Face ...

  9. FTP调优

    最近在解决客户的问题时接触到了一些FTP的问题,自己在使用过程中发现了很多问题,所以这里总结了一些调优的办法: 服务:vsftp 非常安全文件传输 配置文件:/etc/vsftpd/vsftpd.co ...

  10. 【1】部署环境python+pycharm+JDK+SDK+node安装+appium安装+Appium-python-client安装及配置+（模拟器）

    安装SDK检查命令  adb doctor 安装JDK,SDK是为了手机端应用程序的访问去做的基础库的搭建 JDK,SDK环境变量需要在一块,不要一个上,一个下 JAVA_HOME  Path  在一 ...