浏览器阻塞渲染的情况

• 渲染的前提是生成渲染树，所有HTML和CSS肯定会阻塞渲染，想要渲染快，要一开始降低需要渲染的文件大小，扁平层级，优化选择器
• 当浏览器解析到script标签时，会暂停构建DOM，完成后才会从暂停的地方重新开始，想要首屏渲染快，将script标签放在body标签底部
• script标签不是一定要在底部，可以给script标签添加defer或者async属性
  • defer 规定是否对脚本执行进行延迟，直到页面加载为止。defer属性会开启新的线程下载脚本文件并延迟执行引入 的JavaScript脚本；defer脚本会在DOMContentLoaded之后和load事件之前执行（JS文件会并行下载，但会放在HTML解析完成后顺序执行，所以可以放在任意位置）
  • async 规定异步执行脚本（仅适用于外部脚本）。（对于没有任何依赖的JS文件可以加上async，表示JS文件下载和解析不会阻塞渲染，其下载和执行都是异步的，不能确保彼此的先后顺序）