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 ...
随机推荐
- Centos 7 安装 erlang
https://www.cnblogs.com/swyy/p/11582309.html https://blog.csdn.net/qq_20492999/article/details/81254 ...
- JAXB学习(一):概述
pre.XML { background-color: rgba(255, 204, 204, 1); padding-left: 25px } JAXB是 Java Architecture for ...
- Redis 常见问题总结
1. 简单介绍一下 Redis 呗! 简单来说 Redis 就是一个使用 C 语言开发的数据库,不过与传统数据库不同的是 Redis 的数据是存在内存中的 ,也就是它是内存数据库,所以读写速度非常快, ...
- linux:搭建java web环境
介绍 运行java web的环境 搭建 准备 Linux:Linux 操作系统 Apache Tomcat:Web 应用服务器 JDK:Java 开发工具包 jdk的安装 1.下载 链接 2.上传服务 ...
- 网际互连__OSI七层模型
概述 OSI(Open System Interconnection,开放系统互连)七层网络模型称为开放式系统互联参考模型 ,是一个逻辑上的定义.一个规范.它把网络从逻辑上分为了7层.每一层都有相关. ...
- ARP病毒系列——基础篇
概念和关系介绍:(ARP.IP.Mac 三者的关系) ARP,全称Address Resolution Protocol,中文名为地址解析协议,它工 ...
- Effective Java读书笔记--对所有对象都通用的方法
1.覆盖equals请遵守通用规定.不需要覆写equals的场景:a.类的每个实例都是唯一的.b.类不需要提供"逻辑相等"的测试功能.c.超类已经覆盖了equals的方法.d.类是 ...
- Jenkins(2)docker容器中安装python3
前言 使用docker安装jenkins环境,jenkins构建的workspace目录默认是在容器里面构建的,如果我们想执行python3的代码,需进容器内部安装python3的环境. 进jenki ...
- Java并发包源码学习系列:基于CAS非阻塞并发队列ConcurrentLinkedQueue源码解析
目录 非阻塞并发队列ConcurrentLinkedQueue概述 结构组成 基本不变式 head的不变式与可变式 tail的不变式与可变式 offer操作 源码解析 图解offer操作 JDK1.6 ...
- .net core Api 部署到Linux
一.环境介绍 1..net开发环境:asp.net core 3.1 2.Linux环境:CentOS Linux release 7.9.2009 (Core) 3.Swagger: Swashbu ...