前端性能优化的方法

这是我参与新手入门的第2篇文章
总结一下前端性能优化的几个方法，稍微记录一下。

一、静态资源的优化。

浏览器会处理很多静态资源，比如JS,CSS,IMG,这些。
1.很多js和css可以做压缩，还可以进行整合，请求一个文件，肯定比请求多个文件要快一些。利用一些插件，将多个文件进行合并压缩，请求的时候，会快很多。
2.不少运营人员在上传图片的时候，会不注意图片的大小，以至于，可能会上传很多大文件，比如轮播图这些，在设置这些文件上传的时候，需要控制文件的大小，过大的文件不给上传，也可以后台做压缩处理。保证文件大小合适。在请求小图的时候，可以显示压缩图。当用户想看大图的时候，再去请求大图。
3.有些静态资源文件可以适当做一些缓存处理，这样不用每次打开都是重新去请求一遍服务器。
4.图片的格式可以用一些webp这样的格式，好像部分浏览器不太支持，但是浏览器如果支持，这个文件请求会快很多。

二、写代码的时候需要注意避免引起多余回流的操作。

1.在做页面样式编写的时候，要考虑当前写法会不会导致过多的回流。用transition代替元素的大小更改这些。
2.页面的大部分元素都需要集体更新的时候，可以先隐藏这部分元素，更改完成再去显示。
3.减少行内样式的渲染。以前做过一个页面，因为加了很多行内的样式，所以页面的展示会非常慢，后来将这些行内样式全部写入样式表，页面的加载速度快的飞起。

三、及时清理定时器

在定时器完成之后，需要及时清理掉，要不然定时器会一直存在。有次写一个页面，没有清理定时器，然后发现页面越来越卡，而且请求的方法执行速度也越来越快了，定时器执行同一个方法，会让这个执行方法的速度加倍。

四、尽量不要使用闭包

平时写代码，好像用不到闭包，但是也不代表没有，我们尽量不要用闭包的方式写。最好声明局部变量。不需要的变量及时清除掉。留着浪费空间内存。

五、手动进行浏览器的垃圾回收

在当前页面进行销毁的时候，可以手动进行垃圾回收，释放部分的内存空间。

六、按需加载文件或者资源

1.路由懒加载。
2.图片、视频等懒加载
3.引入框架的按需加载

七、避免文件打包多次

打包文件，有些因为不是按需加载，文件资源会一遍又一遍的被打包，有些共同的文件，打包一次就可以了。设置一下打包的配置，将多次打包的文件减少到单次打包。