目录
一、性能优化
1.尽可能拆分组件，利用组件的可复用性，组件的按需加载。
2.keep-live和v-once的使用。
3.混入mixin的使用。
4.vuex的使用。
5.合理使用v-if和v-show。
6.防抖和节流的使用，进行少执行和不执行。
7.使用第三方组件的按需加载。
8.图片懒加载。
9.路由懒加载。
10.抽取出共同的样式放在global.css中，共同的方法。
二、vue
1.keep-live
keep-live是Vue内置的一个组件，可以使被包含的组件保留状态，或避免重新渲染。
在组件切换过程中将状态保留在内存中，防止重复渲染DOM，减少加载时间及性能消耗，提高用户体验性
<keep-alive>
<component>
<!-- 该组件将被缓存！ -->
</component>
</keep-alive>
2.vuex
vuex是使用vue中必不可少的一部分，基于父子、兄弟组件，我们传值可能会很方便，但是如果是没有关联的组件之间要使用同一组数据，就显得很无能为力，那么vuex就很好的解决了我们这种问题，它相当于一个公共仓库，保存着所有组件都能共用的数据。
其中vuex包括
1.state：存放数据。
2.mutations：保存所有方法，用来改变state的数据。（commit触发，同步操作）
3.actions：暴露给用户使用，借此触发mutations中的方法，保存数据（dispatch触发，可执行异步操作）。
4.getters：相当于computed是计算属性，在数据展示前进行一些变化处理，具有缓存功能，能够提高运行效率。
5.modules：模块化，拆分为多个数据空间。（注意用namespaced命名空间，防止模块之间数据的混肴）。
3.v-once
作用是定义它的元素或组件只渲染一次，包括元素或 组件的所有子节点。首次渲染后，不再随数据的变化重新渲染，将被视为静态内容。
如果只想页面加载时显示一次，后续不在因为数据信息的变动而变动时，就可以采取v-once实现。
<span v-once>{{msg}}</span>
4.mixin
https://blog.csdn.net/weixin_67490903/article/details/126372931
5.v-if和v-show
v-if和v-show这两个指令都可以用来控制元素的可见/不可见。
v-if有更高的切换开销（销毁~重建）而v-show有更高的初始渲染开销：不管初始条件是什么，元素总是会被渲染，并且只是简单地基于 CSS 进行切换 它操作的display:none/block属性。如果在运行时条件很少改变，则使用 v-if 较好。
v-show适合做纯页面的交互，例如：抽屉菜单，折叠面板等；v-if适合结合v-else来根据不同的逻辑展示内容，例如用户登录之后根据权限不同来展示不同类型的头像图标。
在vue2中v-if必须写在v-for的上一级标签中。v-for优先级要比v-if高。
在vue3中v-if优先级要高于v-for。
6.防抖和节流
防抖和节流都是用来控制某个函数在一定时间内触发次数，两者都是为了减少触发频率，以便提高性能或者说避免资源浪费。
1.防抖就是指触发事件后在 n 秒内函数只能执行一次，如果在 n 秒内又触发了事件，则会重新计算函数执行时间。
比如说，你转行做外卖员，某天你接到一个订单，准备送，但是感觉不划算，于是准备等一分钟在送，如果这一分钟内有了新的一单，你还会在重新等一分钟，直到一分钟内没有新订单，你才开始配送。
2.节流就是指连续触发事件但是在 n 秒中只执行一次函数。节流会稀释函数的执行频率。
比如一个按钮，在一分钟内，不管你点了多少次，在这个时间内，只会算作一次请求。
7.promise
promise是异步编程的一种解决方案，可以解决回调地狱。
Promise对象代表一个异步操作，有三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败）。
promise本身是同步的，他的.then和.catch是异步微任务。
利用async和await可以直接获取promise成功状态的值。使用await外面必须要有async。
错误捕捉用try.catch。
8.freeze冻结数据
http://t.csdn.cn/PZq62
9.http状态码
http://t.csdn.cn/JJl0P
10.重绘和回流
重绘：简单来说就是重新绘画，当给一个元素更换颜色、更换背景，虽然不会影响页面布局，但是颜色或背景变了，就会重新渲染页面，这就是重绘。
回流：当增加或删除dom节点，或者给元素修改宽高时，会改变页面布局，那么就会重新构造dom树然后再次进行渲染，这就是回流。display:none是样式改变，也会改变页面布局，属于回流。
- 重绘不会引起dom结构和页面布局的变化，只是样式的变化，有重绘不一定有回流。
- 回流则是会引起dom结构和页面布局的变化，有回流就一定有重绘。
不管怎么说都是会影响性能。
11.虚拟dom
在页面初次渲染时，真实dom和虚拟dom会同时构建，在刚开始会略微影响页面加载速度。
通过diff算法结合key，进行两者之间对比，key值是两者之间的桥梁，具有唯一性，在一些情况下不能用index。
总结
每天学一点，迟早成仙！！！
