1、html、css也会阻塞渲染,想要渲染更快,一开始就降低文件的大小、优化选择器,扁平化结构
2、浏览器解析script标签时,会暂停dom的构建,所以一般将script标签放在body后面
script标签可以加上defer属性,表示js文件可以并行下载,不过在解析dom结构完成后才执行
(对于没有依赖的js文件)script标签可以加上async属性,表示js文件下载和解析不会阻塞渲染
3、重绘和回流 改变window大小,改变字体,添加和删除节点,文字改变,定位和浮动,盒模型
减少重绘和回流:
用transform代替top
使用visibility代替display:none
不要把获取的属性值放在循环中当变量使用,获取 offsetTop 会导致回流,因为需要去获取正确的值
不使用table布局
动画实现的速度的选择,动画速度越快,回流次数越多,也可以选择使用 requestAnimationFrame
css选择器从右到左匹配,避免节点层次太多,设置图层,will-change vide iframe标签