前端面试题:如何进行前端的性能优化?
一、DOM层面的优化
1.减少重绘和重排
2.使用事件委托
3.函数的防抖与节流
4.requestAnimationFrame(),将数据进行分割,分批次渲染,减少JS的连续运行时间
二、HTTP网络层面的优化
1.减少http请求次数
2.资源和数据使用缓存
3.DNS预解析处理
4.图片的优化处理
三、Vue层面的优化
1.v-if 和 v-show的分场景使用
2.computed 和 watch的分场景使用
3.图片懒加载
4.路由懒加载
5.ui库插件的按需引入
6.组件使用keep-alive 缓存
7.事件的销毁
8.服务端渲染SSR,预渲染
四、webpack层面的优化
1.使用webpack对图片进行压缩
2.减少es6转为es5的冗余代码
3.提取公共代码
4.模板预编译
5.提取组件的CSS
6.优化SourceMap
7.开启gzip压缩
8.浏览器缓存
9.CDN的使用