精华内容
下载资源
问答
  • EventLoop

    千次阅读 2019-10-30 14:23:14
    EventLoop eventLoop 是由 JS 的宿主环境(浏览器)来实现的;事件循环可以简单的描述为以下四个步骤: /* 1. 函数入栈,当Stack中执行到异步任务的时候,就将他丢给WebAPIs,接着执行同步任务,直到Stack为空; 2. 此...

    EventLoop

    eventLoop 是由 JS 的宿主环境(浏览器)来实现的;事件循环可以简单的描述为以下四个步骤:

    /*
    1. 函数入栈,当Stack中执行到异步任务的时候,就将他丢给WebAPIs,接着执行同步任务,直到Stack为空;
    2. 此期间WebAPIs完成这个事件,把回调函数放入队列中等待执行(微任务放到微任务队列,宏任务放到宏任务队列)
    3. 执行栈为空时,Event Loop把微任务队列执行清空;
    4. 微任务队列清空后,进入宏任务队列,取队列的第一项任务放入Stack(栈)中执行,回到第1步。
    

    我们不禁要问了,那怎么知道主线程执行栈为空呢?js 引擎存在 monitoring process 进程,会持续不断的检查主线程执行栈是否为空,一旦为空,就会去 Event Queue 那里检查是否有等待被调用的函数

    js 是单线程,就像学生排队上厕所,学生需要排队一个一个上厕所,同理 js 任务也要一个一个顺序执行。如果一个任务耗时过长,那么后一个任务也必须等着。那么问题来了,假如我们想浏览新闻,但是新闻包含的超清图片加载很慢,难道我们的网页要一直卡着直到图片完全显示出来?因此聪明的程序员将任务分为两类:

    同步任务

    当我们打开网站时,网页的渲染过程就是一大堆同步任务,比如页面骨架和页面元素的渲染。而像加载图片音乐之类占用资源大耗时久的任务,就是异步任务。关于这部分有严格的文字定义,但本文的目的是用最小的学习成本彻底弄懂执行机制

    异步任务

    异步任务又分为宏任务和微任务。微任务:then 、messageChannel 、mutationObersve;宏任务:setTimeout、setInterval、setTmmediate(只兼容 ie)。

    js 异步有一个机制,就是遇到宏任务,先执行宏任务,将宏任务放入 eventqueue,然后在执行微任务,将微任务放入 eventqueue 最骚的是,这两个 queue 不是一个 queue。当你往外拿的时候先从微任务里拿这个回掉函数,然后再从宏任务的 queue 上拿宏任务的回掉函数。 我当时看到这我就服了还有这种骚操作。

    微任务(Microtasks)

    then 、messageChannel 、mutationObersve

    • Promise

    Promise 是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理和更强大。它由社区最早提出和实现,ES6 将其写进了语言标准,统一了用法,原生提供了 Promise 对象。

    setTimeout(() => {
      console.log("setTimeout1");
    }, 0);
    let p = new Promise((resolve, reject) => {
      console.log("Promise1");
      resolve();
    });
    p.then(() => {
      console.log("Promise2");
    });
    // Promise1->Promise2->setTimeout1
    

    Promise 参数中的 Promise1 是同步执行的 其次是因为 Promise 是 microtasks,会在同步任务执行完后会去清空 microtasks queues, 最后清空完微任务再去宏任务队列取值。

    • process.nextTick(callback)

    process.nextTick(callback)类似 node.js 版的"setTimeout",在事件循环的下一次循环中调用 callback 回调函数。

    async function async1() {
      console.log("async1 start");
      await async2();
      console.log("async1 end");
    }
    async function async2() {
      console.log("async2");
    }
    console.log("script start");
    setTimeout(function() {
      console.log("settimeout");
    });
    async1();
    new Promise(function(resolve) {
      console.log("promise1");
      resolve();
    }).then(function() {
      console.log("promise2");
    });
    setImmediate(() => {
      console.log("setImmediate");
    });
    process.nextTick(() => {
      console.log("process");
    });
    console.log("script end");
    // script start->async1 start->async2->promise1->script end->async1 end->process->promise2->settimeout->setImmediate
    

    process.nextTick 会在微任务将执行时执行,所以会比.then 先一步执行。

    宏任务(task)

    包括整体代码 setTimeout、setInterval、setTmmediate(只兼容 ie)。

    • setTimeout
    setTimeout(() => {
      task();
    }, 3000);
    sleep(10000000);
    

    乍一看其实差不多嘛,但我们把这段代码在 chrome 执行一下,却发现控制台执行 task()需要的时间远远超过 3 秒,说好的延时三秒,为啥现在需要这么长时间啊? 这时候我们需要重新理解 setTimeout 的定义。我们先说上述代码是怎么执行的:

    /*
    task()进入Event Table并注册,计时开始。
    执行sleep函数,很慢,非常慢,计时仍在继续。
    3秒到了,计时事件timeout完成,task()进入Event Queue,但是sleep也太慢了吧,还没执行完,只好等着。
    sleep终于执行完了,task()终于从Event Queue进入了主线程执行。
    
    • setTimeout(fn,0)

    我们还经常遇到 setTimeout(fn,0)这样的代码,0 秒后执行又是什么意思呢?是不是可以立即执行呢?

    //代码1
    console.log("先执行这里");
    setTimeout(() => {
      console.log("执行啦");
    }, 0);
    

    答案是不会的,setTimeout(fn,0)的含义是,指定某个任务在主线程最早可得的空闲时间执行,意思就是不用再等多少秒了,只要主线程执行栈内的同步任务全部执行完成,栈为空就马上执行。举例说明:

    • setInterval

    上面说完了 setTimeout,当然不能错过它的孪生兄弟 setInterval。他俩差不多,只不过后者是循环的执行。对于执行顺序来说,setInterval 会每隔指定的时间将注册的函数置入 Event Queue,如果前面的任务耗时太久,那么同样需要等待。

    唯一需要注意的一点是,对于 setInterval(fn,ms)来说,我们已经知道不是每过 ms 秒会执行一次 fn,而是每过 ms 秒,会有 fn 进入 Event Queue。一旦 setInterval 的回调函数 fn 执行时间超过了延迟时间 ms,那么就完全看不出来有时间间隔了。这句话请读者仔细品味。

    Node 的 EventLoop

    Node 环境中微任务是插缝执行,(如果执行宏任务的时候发现了微任务, 不会像浏览器一样执行了,而是将为微任务放到微任务队列中,等待整个宏 任务队列执行完毕或者达到执行上线后,下一个阶段开始的时候先执行 完微任务队列中的任务)。

    • 认识 Node 中的任务源(task)
    /*
    微任务: then 、nextTick 、 messageChannel 、mutationObersve
    宏任务:setTimeout 、setInterval 、setImmediate 、io 文件操作
    

    参考文献

    展开全文
  • Event Loop

    千次阅读 2013-10-24 20:12:44
    Event Loop 是一个很重要的概念,指的是计算机系统的一种运行机制。  JavaScript语言就采用这种机制,来解决单线程运行带来的一些问题。  本文参考C. Aaron Cois的《Understanding The Node.js Event ...

    Event Loop 是一个很重要的概念,指的是计算机系统的一种运行机制。

      JavaScript语言就采用这种机制,来解决单线程运行带来的一些问题。

    Event Loop

      本文参考C. Aaron Cois的《Understanding The Node.js Event Loop》,解释什么是Event Loop,以及它与JavaScript语言的单线程模型有何关系。

      想要理解Event Loop,就要从程序的运行模式讲起。运行以后的程序叫做"进程"(process),一般情况下,一个进程一次只能执行一个任务。

      如果有很多任务需要执行,不外乎三种解决方法。

    (1)排队。因为一个进程一次只能执行一个任务,只好等前面的任务执行完了,再执行后面的任务。

    (2)新建进程。使用fork命令,为每个任务新建一个进程。

    (3)新建线程。因为进程太耗费资源,所以如今的程序往往允许一个进程包含多个线程,由线程去完成任务。(进程和线程的详细解释,请看这里进程与线程的一个简单解释。)

      以JavaScript语言为例,它是一种单线程语言,所有任务都在一个线程上完成,即采用上面的第一种方法。一旦遇到大量任务或者遇到一个耗时的任务,网页就会出现"假死",因为JavaScript停不下来,也就无法响应用户的行为。

      你也许会问,JavaScript为什么是单线程,难道不能实现为多线程吗?

      这跟历史有关系。JavaScript从诞生起就是单线程。原因大概是不想让浏览器变得太复杂,因为多线程需要共享资源、且有可能修改彼此的运行结果,对于一种网页脚本语言来说,这就太复杂了。后来就约定俗成,JavaScript为一种单线程语言。(Worker API可以实现多线程,但是JavaScript本身始终是单线程的。)

      如果某个任务很耗时,比如涉及很多I/O(输入/输出)操作,那么线程的运行大概是下面的样子。

    synchronous mode

      上图的绿色部分是程序的运行时间,红色部分是等待时间。可以看到,由于I/O操作很慢,所以这个线程的大部分运行时间都在空等I/O操作的返回结果。这种运行方式称为"同步模式"(synchronous I/O)或"堵塞模式"(blocking I/O)。

      如果采用多线程,同时运行多个任务,那很可能就是下面这样。

    synchronous mode

      上图表明,多线程不仅占用多倍的系统资源,也闲置多倍的资源,这显然不合理。

      Event Loop就是为了解决这个问题而提出的。Wikipedia这样定义:

    "Event Loop是一个程序结构,用于等待和发送消息和事件。(a programming construct that waits for and dispatches events or messages in a program.)"

      简单说,就是在程序中设置两个线程:一个负责程序本身的运行,称为"主线程";另一个负责主线程与其他进程(主要是各种I/O操作)的通信,被称为"Event Loop线程"(可以译为"消息线程")。

    asynchronous mode

      上图主线程的绿色部分,还是表示运行时间,而橙色部分表示空闲时间。每当遇到I/O的时候,主线程就让Event Loop线程去通知相应的I/O程序,然后接着往后运行,所以不存在红色的等待时间。等到I/O程序完成操作,Event Loop线程再把结果返回主线程。主线程就调用事先设定的回调函数,完成整个任务。

      可以看到,由于多出了橙色的空闲时间,所以主线程得以运行更多的任务,这就提高了效率。这种运行方式称为"异步模式"(asynchronous I/O)或"非堵塞模式"(non-blocking mode)。

      这正是JavaScript语言的运行方式。单线程模型虽然对JavaScript构成了很大的限制,但也因此使它具备了其他语言不具备的优势。如果部署得好,JavaScript程序是不会出现堵塞的,这就是为什么node.js平台可以用很少的资源,应付大流量访问的原因。

    展开全文
  • event loop

    2019-06-20 16:44:30
    event_base_loop 三种模式:不管哪种模式,如果没有Event加入,event_base_loop 都将直接返回。 EVLOOP_ONCE: 如果没有event,那么程序直接返回 ,否则一直阻塞直到完成一次事件触发回调才退出。 EVLOOP_NONBLOCK...
    1.开始循环

    event_base_loop 三种模式:不管哪种模式,如果没有Event加入,event_base_loop 都将直接返回。

    1. EVLOOP_ONCE: 如果没有event,那么程序直接返回 ,否则一直阻塞直到完成一次事件触发回调才退出。
    2. EVLOOP_NONBLOCK: 不阻塞进程,如果没有event或者没有事件触发,那么程序直接返回。如果存在事件,则调用优先级最高的事件一次回调才退出。
    3. EVLOOP_NO_EXIT_ON_EMPTY: 如果没有event则直接返回。否则程序将一直保持运行状态,直至调用event_base_loopexit 或 event_base_loopbreak或发生了错误 函数才返回。
      Note:参数0等价于效果EVLOOP_NO_EXIT_ON_EMPTY。
    2.停止循环

    event_base_loopexit: 如果tv参数不为空,则让event_base在给定时间之后停止循环。如果tv参数为NULL,event_base会立即停止循环,没有延时。如果event_base当前正在执行任何激活事件的回调,则回调会继续运行,直到运行完所有激活事件的回调之才退出。

    event_base_loopbreak: event_base立即退出循环。它与event_base_loopexit(base,NULL)的不同在于,如果event_base当前正在执行激活事件的回调,它将在执行完当前正在处理的事件后立即退出。

    3.libevent 线程安全
    1. evthread_use_windows_threads(windows多线程)
    2. evthread_use_pthreads(pthread 多线程)

    如果使用多线程的情况下必须根据实际情况调用上面其一函数并且要在event_base_new之前调用,不然会导致event_base_dispatch时一直处于Sleep状态,无法正常工作。

    展开全文
  • eventloop

    2020-11-09 23:56:35
    浏览器工作原理 单线程的含义 浏览器是multi-process,一个浏览器只有一个Browser Process,负责管理Tabs、协调其他...thread,其中main thread负责页面渲染(GUI render engine)执行JS (JS engine)和event l

    浏览器工作原理

    单线程的含义

    浏览器是multi-process,一个浏览器只有一个Browser Process,负责管理Tabs、协调其他processRender process 存至 memory内的 Bitmap绘制到页面上的(pixel):在 Chrome 中,一个Tab对应一个Render Process,Render Processmulti-thread,其中main thread负责页面渲染(GUI render engine)执行JSJS engine)和event loop; network component可以开2-6个I/O threads平行去处理

     

    浏览器端的event loop

    一个函数执行栈、一个事件队列和一个微任务队列

    每从事件队列中取一个事件时有微任务把微任务执行完,然后才开始执行事件

     

     

    宏任务和微任务

    • 宏任务,macrotask,也叫tasks,一些异步任务的回调会依次进入macro task queue,等待后续被调用,这些异步任务包括:

      • setTimeout

      • setInterval

      • setImmediate(Node独有)

      • requestAnimationFrame(浏览器独有)

      • I/O

      • UI rending (浏览器独有)

    • 微任务,microtask,也叫jobs,另一些异步任务的回调会依次进入micro task queue,等待后续别调用,这些异步任务包括:

      • process nextTick(Node 独有)

      • Promise.then()

      • Object.observe

      • MutationObserver

      注:这里只针对浏览器和NodeJS

      Promise构造函数里的代码是同步执行的

    •  

     

    Nodejs架构图

     

    Node.js中的Event Loop

     

    Node.js的Event Loop过程

    • 执行全局Script的同步代码

    • 执行microtask微任务,先执行所有Next Tick Queue中所有任务,在执行Other Microtask Queue

      中的所有任务

    • 开始执行macrotask宏任务,共6个阶段,从第1个阶段开始执行相应每一个阶段macrotask中的所有任务,注意,这里是所有每个阶段宏任务队列的所有任务,在浏览器的Event Loop中是只取宏队列的第一个任务出来执行,每一个阶段的macrotask任务执行完毕后,开始执行微任务,也就是步骤2

    • Timers Queue -> 步骤 -> I/O Queue -> 步骤2 -> Check Queue -> 步骤2 -> Close Callback Queue -> 步骤2 -> Timers Queue ......
    • 这就是Node的Event Loop【简化版】

     

     

     

    展开全文
  • event loop的理解(event loop事件循环的运行机制)

    千次阅读 多人点赞 2021-02-04 15:50:12
    event loop的理解(event loop即事件循环的运行机制) 前言 js是一种单线程的语言,所以它通过event loop机制实现了对异步任务和多线程。 首先你要对栈、队列的数据结构有一定的了解,其次还要会Promise才能看懂...
  • 这篇文章浅析一个 javascript 中的 Event Loop 与 node 中 event loop 的异同, 如果不对之处, 欢迎指正 javascript 中的 event loop 我们都知道 javascript 是单线程的, Javascript 作为浏览器脚本语言,主要...
  • Netty之EventLoop

    2019-11-29 22:37:35
    EventLoopGroup 是一组 EventLoop 的抽象,Netty 为了更好的利用多核 CPU 资源,一般会有多个 EventLoop 同时工作,每个 EventLoop 维护着一个 Selector 实例。 EventLoopGroup 提供 next 接口,可以从组里面按照...
  • 不要在nodejs中阻塞event loop

    千次阅读 2021-02-02 07:34:05
    我们知道event loop是nodejs中事件处理的基础,event loop中主要运行的初始化和callback事件。除了event loop之外,nodejs中还有Worker Pool用来处理一些耗时的操作,比如I/O操作。 nodejs高效运行的秘诀就是使用...
  • muduo之EventLoop

    千次阅读 2019-10-10 20:52:40
    EventLoop.cc就相当于一个reactor,多线程之间的函数调用(用eventfd唤醒),epoll处理,超时队列处理,对channel的处理。运行loop的进程被称为IO线程,EventLoop提供了一些API确保相应函数在IO线程中调用,确保没有用...
  • 理解js的事件循环Event Loop

    万次阅读 2021-03-16 23:33:05
    那么什么是事件循环Event Loop呢? 因为js是单进程的,所以有了异步,同步异步出现后就有了事件执行的先后顺序 简单说,就是在程序中设置两个线程:一个负责程序本身的运行,称为"主线程";另一个负责主线程与其他...
  • Event Loop简单理解

    2020-06-17 14:04:36
    前端面试总结2什么是 Event Loop? 什么是 Event Loop? 原文参考链接 Event Loop 是一个很重要的概念,指的是计算机系统的一种运行机制。 JavaScript语言就采用这种机制,来解决单线程运行带来的一些问题。 本文...
  • Event loop的理解

    2017-09-07 20:25:46
    概念(事件循环)Event Loop,浏览器中,js引擎线程会循环从任务队列(task queue)中读取事件并且执行,这种运行机制叫做事件循环(event loop)为什么要了解Event loop理解Event loop,对于浏览器处理事件的过程会...
  • 1、Event Loop?...Event Loop 的分析,如果你想对 Event Loop 有一个深入的了解,那这里推荐你一篇 Event Loop 的官方文档,这有中文版:Event Loop。 在了解 Event Loop 之前我们可能需要一点计算机操作
  • GLib Event Loop

    2018-05-24 07:02:08
    GLibEvent LoopThe GLib event loop manages all the sources of an event availablefor GLib. These events can come from different kinds of sources like filedescriptors (plain file descriptors, sockets, or...
  • 浅析浏览器的Event Loop

    千次阅读 2020-10-28 09:33:36
    前言 众所周知 JS 是门非阻塞单线程语言,因为在最初 JS 就是为了和浏览器交互而诞生的。...Event Loop 是计算机系统的一种运行机制。 想要理解 Event Loop,就要从程序的运行模式讲起。运行以后的程序叫做"进程"(p.
  • 什么是Event Loop

    2020-07-25 20:22:44
    Event Loop Wikipedia这样定义: “Event Loop是一个程序结构,用于等待和发送消息和事件。(a programming construct that waits for and dispatches events or messages in a program.)” 为什么出现 Event ...
  • Event Loop事件循环

    2019-10-07 02:55:59
    Event Loop事件循环 asyncio.get_running_loop() 返回当前OS线程中的运行事件循环。 asyncio.get_event_loop() 获取当前事件循环。 asyncio.set_event_loop(loop) 将loop设置为当前OS线程的当前事件循环。 asyncio....
  • Main event loop

    2016-06-30 22:06:36
    In the main event loop, an application continuously routes incoming events to objects for handling and, as a result of that handling, updates its appearance and state. An event loop is simply a run lo
  • spark eventLoop模型

    2020-01-06 01:03:59
    Sprak中,线程之前的交互采用eventLoop模型。 当JobGenerate中的clock达到触发新一次job生成的时间后,并不会直接驱动graph去生成job,而是通过往eventLoop中发送一个JobGenerate事件以触发job生成事件的产生。 ...
  • js面试——eventLoop

    2020-06-16 13:40:41
    什么是eventLoop? event loop指的是一种运行机制,规定了JS引擎是如何运行代码的。 为什么会有eventLoop? 由于JS是单线程执行的,所以任务(代码)的执行需要进行排队。任务分为两种:同步和异步,针对异步任务,...
  • 在Netty 中, 每个Channel 都有且仅有一个EventLoop 与之关联, 它们的关联过程如下: 从上图中我们可以看到,当调用AbstractChannel$AbstractUnsafe.register()方法后,就完成了Channel 和EventLoop的关联。...
  • EventLoop:事件循环 1个EventLoopGroup中包含1个或多个EventLoop 1个EventLoop在它的整个生命周期当中只会与唯一一个Thread进行绑定 所有由EventLoop所处理的各种I/O事件都将在它关联的那个Thread上进行处理。 ...
  • Event Loop浅谈

    千次阅读 2018-06-08 08:08:00
    event loop 即事件循环。最初了解到js的event loop机制是通过自己对js中异步、同步的疑惑。今天聊一聊自己的理解,希望和大家一起学习。首先,让我们看一个...
  • 浏览器中的各种Web API为异步的代码提供了一个单独的运行空间,当异步的代码运行完毕以后,会将代码中的回调送入到Task Queue...调用栈仍然会不断检测任务队列中是否有代码需要执行,这一过程就是完整的Event Loop
  • 什么是Event Loop? Event Loop 是一个很重要的概念,指的是计算机系统的一种运行机制,决定了同步代码和异步代码的执行方式。 JavaScript语言就采用这种机制,来解决单线程运行带来的一些问题。 Event Loop在不同的...
  • Libvirt之event loop(一)

    千次阅读 2017-06-13 10:54:10
    Libvirt之event loop Event driven programming The event loop API Worker pool 本文主要讲述 libvirt 所使用的 event loop 方法,以及 server 端和 client 端如何通过 event loop 交互。event驱动的程序一般,一个...
  • Netty学习之EventLoop&Threading Model 前言 在前面我们学习了Netty的众多组件,如ByteBuf、Channel、ChannelHandler、ChannelPipeline等,这些组件组合起来具有神奇的魔力,而EventLoop则是赋予它们...
  • Qt-EventLoop

    2019-02-19 16:22:42
    之前,对于eventLoop的理解即while(1){},在某些效果上,的确生效。于是与对其认知,阻塞等待。 但是,while(1)这样的死循环,一堵所有,惨无人道,在Qt开发中不建议使用,因为某时刻出现错误,而且有损于Qt的事件...
  • 前端面试大全:Event Loop

    千次阅读 2019-01-16 10:13:09
    (内容同步自小邹的头条号:沪漂程序员的生活史) ...这其实涉及到了 Event Loop 相关的知识,这一篇文章我们会来详细地了解 Event Loop 相关知识,这也是面试经常会问的一个问题。   进程与线程 ...
  • 深入理解nodejs Event loop

    千次阅读 2017-08-02 17:29:57
    Event loop 允许node.js执行非阻塞I/O操作(尽管JS是单线程的),也就是在相应情况下,尽可能的将任务交给系统内核。 多数内核是多线程的,可以同时处理多个任务。当其中一个任务完成时,相应的callback被插入到轮询...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 113,624
精华内容 45,449
关键字:

eventloop