前端性能优化---4.css、js 的加载与执行

1.一个网站在浏览器端是如何进行渲染的呢？

1.我们输入网址向服务器发送请求，服务器会返回一个html的文档，
2.该html文档会被浏览器中的html解析器解析
3.从上到下一步一步的生成DOM树
4.在生成DOM的过程中会解析css资源，生成css树
5.解析js资源，由浏览器的v8引起进一步解析
6.css树和DOM树结合形成Render Tree
6.渲染出页面

2.HTML渲染过程的一些特点

2.1顺序执行、并发加载

从上向下，从外向内执行的html，
html中会引入很多的外部资源，这些外部资源都是并发加载的，所以一般会设置3，4个CDN域名，以防止阻塞

2.2是否阻塞

css：
css head中阻塞页面的渲染
css阻塞js的执行
css不阻塞外部脚本的加载

js：
直接引入的js阻塞页面的渲染
js不阻塞资源的加载
js顺序执行，阻塞后续js逻辑的执行

2.3依赖关系

页面渲染依赖于css的加载
js的执行顺序的依赖关系
js逻辑对于dom节点的依赖关系

2.4引入方式

直接引入
defer
async
异步动态引入js（需要的时候再引入）