优化 - 前端篇
一、优化之函数节流
函数节流:原理很简单,利用定时器,让函数执行延迟500毫秒,在500毫秒内如果有函数又被调用则删除上一次调用,这次调用500毫秒后执行,如此往复。
二、优化之前端控制
- 按钮防重复
- 代码压缩,提高加载速度
- 待更新...
三、优化之动静态数据分离
- CDN => 优化 - CDN
- 待更新...
四、JS文件加载性能优化
项目打包后,会生成三个JS文件:manifest.js(配置代码)、vendor.js(公用代码)、app.js(业务逻辑)。一般情况,manifest.js 和 vendor.js 无需优化,只针对 app.js 优化。
优化规则:当整个 app.js 超过 1MB 才需要优化,采用异步组件按需加载方法。如果不用这个方法的话,会一开始就把整个项目全部的 js 都会加载进去,很耗时。
但如果没有超过 1MB,推荐不需要优化,因为按需加载的话,有一个代价是HTTP请求,如果 app.js 比较小的话,按需加载时的HTTP请求的代价会超过默认的一次性加载,所以这时不推荐异步组件按需加载。