记录点东西

笔记来源：浏览器运行机制详解

1.浏览器页面的渲染流

1. 解析html得到DOM树：html解析包含有一系列的步骤，过程为**Bytes -> Characters -> Tokens -> Nodes -> DOM。**最终将html解析为DOM树。
2. 解析css得到CSS树：Bytes -> Characters -> Tokens -> Nodes -> CSSOM。
3. 合并得到render树
4. 布局，当页面有元素的尺寸、大小、隐藏有变化或增加、删除元素时，重新布局计算，并修改页面中所有受影响的部分
5. 绘制，当页面有元素的外观发生变化时，重新绘制
6. GUI线程将得到的各层的位图（每个元素对应一个普通图层）发送给Browser进程，由Browser进程将各层合并，渲染在页面上

2.Dom的ContentLoaded和load事件

• DOMContentLoaded：当DOM加载完成触发
• load：当DOM，样式表，脚本都加载完时触发

所以DOMContentLoaded在load之前触发

3.css和js的阻塞

对于css：

1. 首先，是在Browser进程中下载css文件，当下载完成后，发送给GUI线程。
2. 其次，是在GUI线程中解析html及css，不过这两者是并行的。
3. 由于css的下载和解析不会影响DOM树，所以不会堵塞html文件的解析，但会堵塞页面渲染。
4. 这样的设计是非常合理的，如果css文件的下载和解析不会堵塞页面渲染，那么在页面渲染的途中或结束后发现元素样式有变化，则又需要回流和重绘。

对于js:

js文件的下载和解析执行都会堵塞html文件的解析及页面渲染。

因为js脚本可能会改变DOM结构，若是其不堵塞html文件的解析及页面渲染的话，那么当js脚本改变DOM结构或元素样式时，会引发回流和重绘，会造成不必要的性能浪费，不如等待js执行完，在进行html解析和页面渲染。

如果你不想js堵塞的话，则使用async属性，这样就可以异步加载js文件，加载完成后立即执行。

导致页面无法立即响应的原因:

执行栈中还有任务未执行完，或者是js引擎线程被GUI线程堵塞。

笔记来源：Cookie浅析

直接进网页看把，关于xss和csrf讲解的挺好的。

笔记来源：JavaScript引擎浅析

写的太好了，可以细读。