理论知识
浏览器的渲染过程由一个线程单独负责，我们暂且称其为UI线程。当浏览器从远程服务器获取到一个HTML文档后，首先会先生成相应的DOM树，然后UI线程开始遍历DOM树，挨个渲染每个元素节点。当遇到script节点时，UI线程会暂时阻塞，将script交给js引擎编译执行。当script脚本执行完毕后，UI线程会再次渲染剩下的元素。
在执行script脚本时，UI线程是阻塞的，势必会影响到页面加载的速度，所以在script中向远程服务器请求时我们都做成异步的，加快渲染速度。
还有一个优化小Tip是把我们自定义的js文件在最后引入，这样就可以让用户先看到一些界面。
下面这张图片展示了UI线程的执行过程
上面所说的UI线程直接遍历DOM树进行渲染严格来说是不正确的，通常情况下，DOM树还需要进一步进化为Render树和RenderLayer树才能被UI线程进行渲染。
Render树是基于DOM树建立起来的一颗新的树， 是布局和渲染等机制的基础设施。 Render树节点和DOM树节点不是一一对应关系，那么哪些情况下需要建立新的Render节点呢？
-
DOM树的document节点；
-
DOM树中的可视化节点，例如HTML，BODY，DIV等，非可视化节点不会建立Render树节点，例如HEAD，META，SCRIPT等；
-
某些情况下需要建立匿名的Render节点，该节点不对应于DOM树中的任何节点；
Render树建立完成后，布局运算就会计算出相关的属性，如位置，大小，是否浮动等。
767
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
