在浏览器输入地址按回车后，执行如下操作：
包括：排队-》与代理服务器连接通讯-》DNS解析（不同域名）-》建立连接-》发送请求-》等待服务器相应，即第一个字节发过来-》接受相应数据，即整个html文档内容数据-》直到接收到最后一个字节。 注：加载文件即指上述过程
具体见转载： 从输入 URL 到页面加载完成的过程
包括script引用的外部js文件、link引用的css文件和html中直接引用的图片。
若遇到link标签，开始加载css文件。 同时顺序解析DOM元素，并构建DOM树。 若后面有js脚本，则脚本会被阻塞，直到css加载并解析完毕才会执行js脚本。 若后面有外部js脚本，则并行加载js脚本，但会等css加载并解析完毕才会执行外部脚本。加载前会先将此script标签解析到Elements中。 若碰到img标签，则加载图片资源。但不会等待下载，还是继续向下解析。解析的同时若图片下载完则会占空间。
注：关于script和link的书写顺序，这样定义：link和style在head里，script在body最后。这是因为js一般用来操作DOM元素，而html会动态渲染样式。 若script放在body之前任何位置，要是有对DOM的操作，包括样式操作，浏览器会重新去渲染这个元素，然后才继续向下渲染。要是此时DOM不存在则会报错。 script放在body结尾处时，所有的DOM元素都已渲染完，此时js再操作DOM不会报错，且减少了DOM渲染次数。
1、构建DOM树 2、DOM树与CSS样式进行附着构造呈现树 3、布局 4、绘制
浏览器有专门的html解析器，解析HTML并在解析的过程中构建DOM树（即在Elements中呈现）。
浏览器是自上而下解析的。
有两种DOM元素在解析的过程中会阻塞浏览器的解析。即样式（link、style）与脚本文件（script）。 在遇到这些元素时，会阻塞浏览器的解析，直到外部资源加载并解析或执行完毕后才会继续向下解析html。
样式与脚本的先后顺序会影响解析过程，具体有4个结论： a、外部样式会阻塞后续脚本的执行，直到外部样式加载并解析完毕。 b、外部样式不会阻塞后续外部脚本的加载，但会阻塞外部脚本的执行。 即外部脚本与外部样式会并行加载，但直到外部样式加载完毕，外部脚本才开始执行。 c、如果后续外部脚本含有async属性，则外部样式不会阻塞该脚本的加载与执行。 d、动态创建的link标签不会阻塞其后动态创建的script的加载与执行，不管script标签是否含有异步属性。
以上解析顺序自上而下，遇到link style与脚本文件，样式标签会互相影响script标签，但html中引用的其他资源仍会并行加载，不会影响script脚本的执行。
加载的时候会同步构建DOM树。 然后开始解析body中的元素。
html元素解析完毕，DOM树创建完成后，会触发DOMContentLoaded事件，此时可用script来操作DOM节点。
构建呈现树的过程，即将CSS样式应用到DOM节点上。 DOM树 + CSS样式 —构建—》 呈现树
呈现树的含义：它的每一个节点即为与其相对应的CSS框，包括block框、inline框。也就是框组成的树。 注：呈现树节点在呈现树中的位置与它们在DOM树中的位置理论上一样，但float与绝对定位元素除外。
呈现树构造完成后浏览器便进行布局处理，即计算每个呈现树节点的大小和位置信息。
这里可以这样理解，之前附着到DOM节点上的样式信息只是存在内存里，并没有实际使用，浏览器要根据窗口的实际大小来处理呈现树节点的实际显示大小和位置，比如对于margin为auto的处理。
布局是一个递归过程，从根呈现节点开始，递归遍历子节点，计算几何信息。
将呈现树绘制出来显示在屏幕上。
对于每一个呈现树节点来说，主要绘制顺序如下： 背景颜色 背景图片 边框 子呈现树节点 轮廓
加载、下载、解析、执行概念 加载：下载 解析：分析代码中是否有特殊额外操作，如含require则根据特定规则决定下载该文件，如遇引用外部js文件则根据特定规则决定是否立马下载该外部js文件。 执行：运行代码。每种语言都有自己的运行时机。如CommonJS中require时，会加载文件并在加载完成后立马执行代码。
参考 http://www.cnblogs.com/dojo-lzz/p/3983335.html
