摘要：
这段参考了参考来源中的第2篇文章（英文版的），（加了下自己的理解重新描述了下）， 这里没法给大家演示代码，我就简单说下我的理解吧。 promise和settimeout 在一起的时候执行顺序是个有意思的事儿， 为什么呢？因为Promise里有了一个一个新的概念：microtask 或者，进一步，JS 阅读全文
摘要：
上述事件循环机制的核心是：JS引擎线程和事件触发线程 但事件上，里面还有一些隐藏细节，譬如调用setTimeout后，是如何等待特定时间后才添加到事件队列中的？ 是JS引擎检测的么？当然不是了。它是由定时器线程控制（因为JS引擎自己都忙不过来，根本无暇分身） 为什么要单独的定时器线程？因为JavaS 阅读全文
摘要：
这里主要是结合Event Loop来谈JS代码是如何运行的。 事件循环对于我们平时开发可以说是特别重要，可以让我们写出更好的代码。 到这里相信我们已经知道了JS引擎是单线程，而且这里会用到前面说的的几个概念：（如果不是很理解，可以看看前几节） JS引擎线程 【执行js代码】 事件触发线程【轮训】 定 阅读全文
摘要：
浏览器器内核拿到内容后，渲染大概可以划分成以下几个步骤： 解析html建立dom树 解析css构建render树（将CSS代码解析成树形的数据结构，然后结合DOM合并成render树） 布局render树（Layout/reflow），负责各元素尺寸、位置的计算 绘制render树（paint），绘 阅读全文
摘要：
这里说的是头部引入css的情况 首先，我们都知道：css是由单独的下载线程异步下载的。 咱们先分析下css加载会影响什么，刚才的问题太笼统了，咱们需要细化一下。 会影响什么呢？ 一个就是DOM树解析，一个就是构建渲染树【render树】。 假设都不影响。 这个时候你加载css的时候，很可能会修改下面 阅读全文
摘要：
到了这里，已经对浏览器的运行有了一个整体的概念，接下来，先简单梳理一些概念 : GUI渲染线程与JS引擎线程互斥 由于JavaScript是可操纵DOM的，如果在修改这些元素属性同时渲染界面（即JS线程和UI线程同时运行），那么渲染线程前后获得的元素数据就可能不一致了。 因此为了防止渲染出现不可预期 阅读全文