html渲染过程的一些特点
顺序执行，并发加载
通过词法分析，通过html生成token对象（当前节点的所有子节点生成后，才会通过next token获取到当前节点的兄弟节点），最终生成dom tree浏览器中可以支持并发请求，不同浏览器所支持的并发数量不同（以域名划分），以chrome为例，并发上限为6个。
优化点： 把cdn资源分布在多个域名下
是否阻塞
css：
   css放在head中会阻塞页面的渲染（也就是说页面的渲染会等到css加载完成）
   css阻塞js的执行 （因为gui线程和js线程是互斥的，因为有可能js会操作css）
   css不阻塞外部脚本的加载（不阻塞js的加载，但阻塞js的执行，因为浏览器都会有预先扫描器）js:
   直接引入的js会阻塞页面的渲染（gui线程和js线程互斥）
   js不阻塞资源的加载(这有赖于chrome的预加载机制)
   js顺序执行，阻塞后续js逻辑的执行
依赖关系
页面渲染依赖于css的加载
（那既然页面是在等待dom tree 和 css tree生成后再去渲染，那为何需要把css放到head中）
(因为css中有可能是异步加载的，所以为了保证依赖关系，需要把css放到head中)
js的执行顺序的依赖关系
js逻辑对于dom节点的依赖关系
引入方式
css引入link @importjs引入
直接引入
defer （不阻塞页面渲染，顺序执行）
async （不阻塞页面渲染，不保证顺序执行）
异步动态引入js
蓝色线代表网络读取，红色线代表执行时间，这俩都是针对脚本的；绿色线代表 html 解析。
加载和执行的一些优化点css样式表置顶 （阻塞页面渲染）
用link代替@import （1，@import是css层面的，不会触发浏览器并发机制；2，在css加载完成后进行的引入。 但现代浏览器中@import和link在表现上已经没有上述区别了。 ）
js脚本置底（因为浏览器有并发限制，所以把js放到下边，减少占用的并发数，使得页面能够更快的渲染出来）
合理使用js的异步加载能力
浏览器的渲染机制
以上就是css和js的加载和执行详解的详细内容。