前端各种优化

页面/资源优化：

1、图片合理的优化方式
(1)、图片懒加载
(2)、小图标使用SVG或者字体图标
(3)、通过 base64 和 webp  的方式加载小型图片
(4)、能通过cdn加速的大图尽量用cdn

2、首屏优化
/**
如果项目很大，那么首次加载资源耗时会比较久，一次可能曹成页面白屏问题。
因此可以在public下写一个加载动画，告诉用户，网页在加载中这个提示。
因此，推荐大家都设计一个自家公司的loading加载方式放入index.html中吧。
**/

加载优化：

1、路由懒加载/按需加载
ps:解决页面首次加载白屏问题
/**
当打包构建应用时，JavaScript 包会变得非常大，影响页面加载。
如果我们能把不同路由对应的组件分割成不同的代码块，
然后当路由被访问的时候才加载对应组件，这样就更加高效了。
**/
//ES提出import方式    ps:最常用
component: () => import('路径')
//vue异步组件实现懒加载
component: resolve=>(require(["路径"],resolve))

2、依赖库CDN加速

代码优化：

1、释放资源
/**当组件销毁后，尽量把我们开辟出来的资源块给销毁掉.
比如 setInterval , addEventListener等，
如果你不去手动给释放掉，那么它们依旧会占用一部分资源。
这就导致了没有必要的资源浪费。
**/
//清理定时器
clearInterVal();
//清理事件监听
removeEventListener();

2、最小化JS文件
/**可以通过webpack处理打包的JavaScript文件，让其更加的精简。
在配置中，你可以这么做
**/
config.optimization.minimize(true);

安全优化：