前端性能优化的解决方案

-----1.资源合并压缩，减少http请求，减小资源大小
-----2.图片优化，精灵图（雪碧图），内联图片【造成浏览器不会缓存，若图片过大，加载速度慢，兼容性差】，webp【图片后缀格式】
-----3.浏览器渲染引擎与阻塞【js文件的解析和css文件的解析互相排斥的，存在先后顺序，】
-----4.懒加载和预加载【一般用于图片和列表】
-----5.减少重绘回流【layout】
1.使用translate替代top等属性来改变位置；
2.使用opacity替代visibility；
3.将多次改变DOM元素样式属性的操作合并成一次操作
4.把DOM离线后再修改；
5.不要把获取某些DOM节点的属性值放在一个循环里当成循环的变量；
6.不要使用table布局；
7.启用GPU硬件加速；
8.动画实现速度的选择；
9.为动画元素新建图层，提高动画元素的z-index；
10.为动画元素新建图层，提高动画元素的z-index；
-----6.函数防抖与节流【定时器】
-----7.浏览器存储优化【Cookie/Web Storage/IndexedDB/PWA/Service Worker】
Cookie：将存放静态资源的CDN服务器域名与主站的域名独立开来。这样每次请求静态文件的时候就不需要携带Cookie，从而可以节省很多流量。
-----8.HTTP通用缓存策略
一般情况使用前6个居多