js消息任务队列

JS单线程、异步、同步概念

多次出现“事件循环”这个名词,简单说明了事件循环的步骤,以便理解nextTick的运行时机,这篇文章将更为详细的分析下事件循环。在此之前需要了解JS单线程,及由此产生的同步执行环境和异步执行环境。

  众所周知,JS是单线程,虽然有webworker酱紫的多线程出现,但也是在主线程的控制下。webworker仅仅能进行计算任务,不能操作DOM,所以本质上还是单线程。

  单线程即任务是串行的,后一个任务需要等待前一个任务的执行,这就可能出现长时间的等待。但由于类似ajax网络请求、setTimeout时间延迟、DOM事件的用户交互等,这些任务并不消耗 CPU,是一种空等,资源浪费,因此出现了异步。通过将任务交给相应的异步模块去处理,主线程的效率大大提升,可以并行的去处理其他的操作。当异步处理完成,主线程空闲时,主线程读取相应的callback,进行后续的操作,最大程度的利用CPU。此时出现了同步执行和异步执行的概念,同步执行是主线程按照顺序,串行执行任务;异步执行就是cpu跳过等待,先处理后续的任务(CPU与网络模块、timer等并行进行任务)。由此产生了任务队列与事件循环,来协调主线程与异步模块之间的工作。

事件循环机制

 

step1:主线程读取JS代码,此时为同步环境,形成相应的堆和执行栈;

step2:  主线程遇到异步任务,指给对应的异步进程进行处理(WEB API);

step3:  异步进程处理完毕(Ajax返回、DOM事件处罚、Timer到等),将相应的异步任务推入任务队列;

step4: 主线程执行完毕,查询任务队列,如果存在任务,则取出一个任务推入主线程处理(先进先出);

step5: 重复执行step2、3、4;称为事件循环。

执行的大意:

同步环境执行(step1) -> 事件循环1(step4) -> 事件循环2(step4的重复)…

其中的异步进程有:

a、类似onclick等,由浏览器内核的DOM binding模块处理,事件触发时,回调函数添加到任务队列中;

b、setTimeout等,由浏览器内核的Timer模块处理,时间到达时,回调函数添加到任务队列中;

c、Ajax,由浏览器内核的Network模块处理,网络请求返回后,添加到任务队列中。

任务队列

如上示意图,任务队列存在多个,同一任务队列内,按队列顺序被主线程取走;不同任务队列之间,存在着优先级,优先级高的优先获取(如用户I/O);

3.1、任务队列的类型

    任务队列存在两种类型,一种为microtask queue,另一种为macrotask queue。

    图中所列出的任务队列均为macrotask queue,而ES6 的 promise[ECMAScript标准]产生的任务队列为microtask queue。

            

3.2、两者的区别

    microtask queue:唯一,整个事件循环当中,仅存在一个;执行为同步,同一个事件循环中的microtask会按队列顺序,串行执行完毕;

    macrotask queue:不唯一,存在一定的优先级(用户I/O部分优先级更高);异步执行,同一事件循环中,只执行一个。

3.3、更完整的事件循环流程    

将microtask加入到JS运行机制流程中,则:

step1、2、3同上,

step4:主线程查询任务队列,执行microtask queue,将其按序执行,全部执行完毕;

step5:主线程查询任务队列,执行macrotask queue,取队首任务执行,执行完毕;

step6:重复step4、step5。

microtask queue中的所有callback处在同一个事件循环中,而macrotask queue中的callback有自己的事件循环。

简而言之:同步环境执行 -> 事件循环1(microtask queue的All)-> 事件循环2(macrotask queue中的一个) -> 事件循环1(microtask queue的All)-> 事件循环2(macrotask queue中的一个)...

利用microtask queue可以形成一个同步执行的环境,但如果Microtask queue太长,将导致Macrotask任务长时间执行不了,最终导致用户I/O无响应等,所以使用需慎重。

示例、验证 

            console.log('1, time = ' + new Date().toString())setTimeout(macroCallback, 0);new Promise(function(resolve, reject) {console.log('2, time = ' + new Date().toString())resolve();console.log('3, time = ' + new Date().toString())}).then(microCallback);function macroCallback() {console.log('4, time = ' + new Date().toString())} function microCallback() {console.log('5, time = ' + new Date().toString())}     

运行结果如下:

1

2

3

5

4

运行结果与预期一致,验证了在不同类型的任务队列中,microtask queue中的callball将优先执行。

    总结:由此我们了解事件循环的机制,同时了解了任务队列、JS主线程、异步操作之间的相互协作;同时认识了两种任务队列:macrotask queue、microtask queue,它们由不同的标准制定,microtask queue对应ECMAScript的promise属性(ES6)和 DOM3的MutationObserver,文中说明了两者在事件循环中的运行情况及区别;在今后的异步操作中,通过灵活运用不同的任务队列,提升用户交互性能,给出更加的响应和视觉体验;同时,通过JS的事件循环机制,可以更清楚JS代码的执行流,从而更好的控制代码,更有效、更好的为业务服务。 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/246901.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Ubuntu下安装cmake,配置ITK 和 SimpleITK, VTK(已测试可执行)

curses库 在安装cmake之前应该先安装一下curses库。如果系统中有curses库的话,cmake将生成一个可执行文件ccmake,它是一个基于文本程序的终端,有点类似windows GUI。 sudo apt-get install libncurses5-dev 备注:若无curses库…

世界坐标与图像坐标

1. 右手坐标系 2. 左手坐标系 伸出左手,让拇指和食指成“L”形,大拇指向右,食指向上。其余的手指指向前方。这样就建立了一个左手坐标系。拇指、食指和其余手指分别代表x,y,z轴的正方向。判断方法:在空间直…

Ubuntu下安装 imagej 和 Fiji

安装ImageJ 方法一 sudo apt-get install imagej whereis imagej imagej -version 方法二 下载 Linux版本的 imagej 安装 Instructions cd /home mkdir imagej cp ij150-linux64-java8.zip /home/imagej unzip ij150-linux64-java8.zip 建立软连接,可以在终端…

Ubuntu下安装Pycharm及相关设置

下载 Pycharm 社区版本 http://www.jetbrains.com/pycharm/download/#sectionlinux 安装指导 Copy the pycharm-community-2016.2.3.tar.gz to the desired installation location (make sure you have rw permissions for that directory) cp /home/bids/Downloads/pycha…

朱松纯:初探计算机视觉三个源头兼谈人工智能

朱松纯 加州大学洛杉矶分校UCLA统计学和计算机科学教授(Song-Chun Zhu;www.stat.ucla.edu/~sczhu) 杨: 朱教授,你在计算机视觉领域耕耘20余年,获得很多奖项,是很资深的研究人员。近年来你又涉足认知科学、…

视觉研究的前世今生(上)王天珍(武汉理工大学)

视觉是人类最重要的知觉,没有视觉人类很难定位,识别物体,了解坏境,得以生存发展。20世纪两次世界大战,使得西方各国,不论是为了飞机安全着陆,还是导弹精确制导,都对视觉研究有了非常…

看了数百个PPT封面,我只想告诉你这两个套路!

做PPT离不开的一个词就是封面,封面即门面,很大程度上决定了你的作品给人的第一印象。 我们经常能够在网上看到一些大神做的封面,比如阿文、珞珈,非常酷炫。 这类封面也许不需要太多技巧,但一定是花了很多心思并且需要…

caffe 框架梳理(待续)

本文更多资料来源于罗韵北京深度学习资料和Ian Goodfellow的书籍《Deep Learning》 链接: http://pan.baidu.com/s/1jIRJ6mU 提取密码:xehi caffe:全称Convolutional Architecture for Fast Feature Embedding,是一个计算CNN 相关算法的框…

深度学习 - 强化学习 -迁移学习(杨强教授报告)

李宏毅机器学习课程-Transfer Learning 深度学习 -> 强化学习 ->迁移学习(杨强教授报告) 链接: http://pan.baidu.com/s/1nu6DMRn 密码: an9q 深度学习的局限 表达能力的限制。因为一个模型毕竟是一种现实的反映,等于是现实的镜像&…

Caffe: 贾扬清2015年讲座

链接: http://pan.baidu.com/s/1jIRJ6mU 提取密码:xehi 一、讲座正文 大家好!我是贾扬清,目前在GoogleBrain,今天有幸受邀来和大家聊聊Caffe。没有太多准备,所以讲的不好的地方还请大家谅解。 大家最近一段时间应该已…

关于机器学习的领悟与反思(张志华北大数学系教授)

张志华教授:机器学习——统计与计算之恋 COS访谈第十九期:张志华教授 张志华老师教学之感悟 部分共享资料见链接: https://pan.baidu.com/s/1bpGc0nP 密码: 49ei ◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆…

《见字如面》赏析-待续

《爸爸的信——学会鄙视自己,才不会妥协》 理想太容易妥协,欲望太容易放大。 百岁老夫妻70年前写出最美战地情书 穿越到70多年前的抗日战争缅甸战场,化身文质彬彬又器宇轩昂的远征军翻译官曹越华,在炮火连天的异国战场&#xf…

机器真的已经战胜人类医生了吗?医学AI标题党文章中的三大陷阱

作者 | Dr Luke Oakden-Rayner 翻译校对|吴蕾 刘晓莉 曹翔 ◆ ◆ ◆ 序 关于“机器人战胜人类医生”的文章铺天盖地,正高居各类科技网站首页。 例如《通过辐射变化,计算机程序的脑肿瘤辨识能力战胜医生(神经科学新闻,2016&#x…

安装测试 Lasagne

Lasagne不只是一个美味的意大利菜,也是一个与Blocks和Keras有着相似功能的深度学习库,但其在设计上与它们有些不同。 下面是Lasagne的一些设计目的: 简单化:它应该是易于使用和扩展的机器学习库。每添加一个特征,就应…

Python 处理医学影像学中的DICOM

DICOMDICOM(Digital Imaging and Communications in Medicine)即医学数字成像和通信,是医学图像和相关信息的国际标准(ISO 12052)。它定义了质量能满足临床需要的可用于数据交换的医学图像格式,可用于处理、…

基于CNN的性别、年龄识别及Demo实现

一、相关理论 本篇博文主要讲解2015年一篇paper《Age and Gender Classification using Convolutional Neural Networks》paper的创新点在哪里。难道是因为利用CNN做年龄和性别分类的paper很少吗?网上搜索了一下,性别预测,以前很多都是用SVM算…

Faster R-CNN的安装及测试(Python版本和Matlab版本)

rbg的Python版本 一、拉取源码 git clone --recursive https://github.com/rbgirshick/py-faster-rcnn.git 拉取完成后,在/home/cmwang/目录下增加了py-faster-rcnn文件夹【cmwang是我的ubuntu用户名】 二、安装依赖 sudo apt-get install python-opencvsudo pip…

2016 亚洲共识指南:肺结节的评估

2016 年 2 月,亚洲肺部疾病和胸外科多学科专家小组在美国胸科医师学会(ACCP)制定的肺结节评估指南的基础上结合亚洲患者的自身特点制订了亚洲肺结节患者的评估指南。 亚洲肺结节的评估与 APCC 指南中所指出的重要注意事项大致相同。但该指南…

Ubuntu 15.04 安装TensorFlow(源码编译) 及测试梵高作画

介绍Google的TensorFlow机器学习开源库,在UbuntuKylin上的安装和和源码编译。 原始官方文档参见:http://www.tensorflow.org. 本电脑配置如下: 3.19.0-15-generic #15-Ubuntu x86_64 GNU/Linux NVIDIA Corporation GK110BGL [Tesla K40c] …

Ubuntu SSH Algorithm negotiation failed

问题 解决方法 chmod 777 /etc/ssh/sshd_configgedit /etc/ssh/sshd_config添加如下 Ciphers aes128-cbc,aes192-cbc,aes256-cbc,aes128-ctr,aes192-ctr,aes256-ctr,3des-cbc,arcfour128,arcfour256,arcfour,blowfish-cbc,cast128-cbcMACs hmac-md5,hmac-sha1,umac-64openssh.…