queueMicrotask & EventLoop & macrotask & microtask
queueMicrotask
https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/queueMicrotask
scope.queueMicrotask(function);
https://html.spec.whatwg.org/multipage/timers-and-user-prompts.html#microtask-queuing
self.queueMicrotask(() => {
// function contents here
})
MyElement.prototype.loadData = function (url) {
if (this._cache[url]) {
queueMicrotask(() => {
this._setData(this._cache[url]);
this.dispatchEvent(new Event("load"));
});
} else {
fetch(url).then(res => res.arrayBuffer()).then(data => {
this._cache[url] = data;
this._setData(data);
this.dispatchEvent(new Event("load"));
});
}
};

https://developer.mozilla.org/en-US/docs/Web/API/HTML_DOM_API/Microtask_guide
macrotask & microtask
https://javascript.info/event-loop
https://zh.javascript.info/event-loop
浅析JS堆、栈、执行栈 和 EventLoop
https://mp.weixin.qq.com/s/Vydvo1PVGgr9zGbYsubX5w
Event loops 秒懂
https://github.com/wangmeijian/blog/blob/master/docs/Event loops秒懂.md
宏任务 task & 微任务 microtask
https://zh.javascript.info/event-loop
https://zh.javascript.info/microtask-queue
critical-rendering-path
前端性能优化
xgqfrms 2012-2020
www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!
queueMicrotask & EventLoop & macrotask & microtask的更多相关文章
- javascript macrotask & microtask
先看一个 实例 案例 console.log('script start'); setTimeout(function() { console.log('setTimeout'); }, 0); Pr ...
- queueMicrotask & microtask
queueMicrotask & microtask microtask microtask queue Promise Mutation Observer API MutationObser ...
- 理解 EventLoop
链接 链接 node 浏览器 执行顺序有差异 macrotask microtask 一个线程会有 堆 栈 消息队列; 栈函数执行是用的, 堆用了存放定义的对象, 消息队列来处理异步的操作 a() ...
- 初识JavaScript EventLoop
Event Loop指的是计算机系统的一种运行机制.JavaScript采用此机制解决单线程引发相关问题 在浏览器中的web应用会涉及到.JavaScript引擎.WebAPI.Event Loop. ...
- Vue nextTick 机制
背景 我们先来看一段Vue的执行代码: export default { data () { return { msg: 0 } }, mounted () { this.msg = 1 this.m ...
- js,timeout,promise执行顺序
总结 macro-task包括:script(整体代码), setTimeout, setInterval, setImmediate, I/O, UI rendering. micro-task包括 ...
- 破阵九解:Node和浏览器之事件循环/任务队列/异步顺序/数据结构
前言 本文内容比较长,请见谅.如有评议,还请评论区指点,谢谢大家! >> 目录 开门见山:Node和浏览器的异步执行顺序问题 两种环境下的宏任务和微任务(macrotask &&a ...
- javascript中的异步 macrotask 和 microtask 简介
javascript中的异步 macrotask 和 microtask 简介 什么是macrotask?什么是microtask?在理解什么是macrotask?什么是microtask之前,我们先 ...
- Javascript中的Microtask和Macrotask——从一道很少有人能答对的题目说起
首先我们来看一道题目,如下javascript代码,执行后会在控制台打印出什么内容? async function async1() { console.log('async1 start'); aw ...
随机推荐
- UserControl和CustomControl两者区别
UserControl 将多个WPF控件(例如:TextBox,TextBlock,Button)进行组合成一个可复用的控件组: 由XAML和Code Behind代码组成: 不支持样式/模板重写: ...
- LOJ10078
CQOI 2005 重庆城里有 n 个车站,m 条双向公路连接其中的某些车站.每两个车站最多用一条公路连接,从任何一个车站出发都可以经过一条或者多条公路到达其他车站,但不同的路径需要花费的时间可能不同 ...
- java 文件转成pdf文件 预览
一.前端代码 //预览功能 preview: function () { //判断选中状态 var ids =""; var num = 0; $(".checkbox& ...
- JQuery——相关练习
####JQuery的基本语法 <!--导入JQuery文件--> <script src="js/jquery-3.1.1.min.js"> /*带min ...
- Grafana+Prometheus通过node_exporter监控Linux服务器信息
Grafana+Prometheus通过node_exporter监控Linux服务器信息 一.Grafana+Prometheus通过node_exporter监控Linux服务器信息 1.1nod ...
- CVE-2020-1472 域内提权
攻击者通过NetLogon(MS-NRPC),建立与域控间易受攻击的安全通道时,可利用此漏洞获取域管访问权限.成功利用此漏洞的攻击者可以在该网络中的设备上运行经特殊设计的应用程序. 影响版本 Wind ...
- gcc选项 笔记
gcc –E hello.c –o hello.i 使用gcc的选项"-E" 让gcc在预处理结束后停止编译过程. gcc –S hello.i –o hello.s &q ...
- Memcached 缓存系统简介
memcached官网:http://memcached.org/ What is Memcached? Memcached是一个自由开源的,高性能,高并发,分布式内存对象缓存系统. Memcache ...
- cassandra权威指南读书笔记--数据建模
没有join操作.有轻量级事务和批处理,但是没有外键等.反规范化.3.0支持物化视图,允许在一个表上创建数据的多个物化视图.使用cassandra要从查询入手,而不是先从数据模型开始.先对查询建模,然 ...
- hdu4533 威威猫系列故事——晒被子
Problem Description 因为马拉松初赛中吃鸡腿的题目让不少人抱憾而归,威威猫一直觉得愧对大家,这几天他悄悄搬到直角坐标系里去住了. 生活还要继续,太阳也照常升起,今天,威威猫在第一象限 ...