------js部分-------
由于JS是一种解释型语言，执行速度要比编译型语言慢得多。（ Chrome将JS编译成本地代码的浏览器，其它浏览器也陆续实现了JS的编译过程。但是，即使到了编译执行JS的新阶段，仍然会存在低效率的代码。）
代码优化：
1 ）条件判断性能优化
if语句 switch语句和数组查询在优化代码执行方面都有各自的用处
最快的条件判断：（判断将大概率的值放前面）
-** 使用if语句的情况
-两个之内的离散值需要判断
-大量的值能容易区分到不同的地方
-** 使用switch语句的情况
-超过2个而少于10个的离散值
-条件是非线性的，无法分离出区间范围
-** 使用数组查询
-超过10个的值需要判断
-条件对应结果是单一值，而不是一系列操作
2）作用域
访问当前作用域之外的变量时间会增加，所以 访问全局变量总是比访问局部变量要慢，因为需要遍历作用域链。只要能减少花费在作用域链上的时间，就能增加脚本的整体性能。
3）循环遍历js中的数组时，经常每次循环需要用到length,其为全局变量每次都要花费较长的时间去获取，故要把它保存在局部变量中，提高效率
for（var i=0；var len = a.length; i < len;i ++） 效率远远大于 for（var i=0;i<a.length;i++）
4）减少http请求
一个完整的请求都需要经过 DNS寻址、与服务器建立连接、发送数据、等待服务器响应、接收数据这样一个 “漫长” 而复杂的过程。时间成本就是用户需要看到或者 “感受” 到这个资源是必须要等待这个过程结束的，资源上由于每个请求都需要携带数据，因此每个请求都需要占用带宽。另外，由于浏览器进行并发请求的请求数是有上限的，因此请求数多了以后，浏览器需要分批进行请求，因此会增加用户的等待时间，会给用户造成站点速度慢这样一个印象，即使可能用户能看到的第一屏的资源都已经请求完了，但是浏览器的进度条会一直存在。
-------vue-------
代码优化:
1）v-if 和 v-show
v-if 是懒加载，当状态为 true 时才会加载，并且为 false 时不会占用布局空间；
v-show 是无论状态是 true 或者是 false，都会进行渲染，并且只是简单地基于 CSS 的 display 属性进行切换，并占据布局空间。对于在项目中，需要频繁调用，不需要权限的显示隐藏，可以选择使用 v-show，可以减少系统的切换开销。
在我来看要分两个维度去思考问题：
第一个维度是权限问题，只要涉及到权限相关的展示无疑要用 v-if，
第二个维度在没有权限限制下根据用户点击的频次选择，频繁切换的使用 v-show，不频繁切换的使用 v-if，
这里要说的优化点在于减少页面中 dom 总数，我比较倾向于使用 v-if，因为减少了 dom 数量，加快首屏渲染，至于性能方面我感觉肉眼看不出来切换的渲染过程，也不会影响用户的体验。
2）不要在模板里面写过多的表达式与判断
v-if="isShow && isAdmin && (a || b)"，这种表达式虽说可以识别，但是不是长久之计，当看着不舒服时，适当的写到 methods 和 computed 里面封装成一个方法，这样的好处是方便我们在多处判断相同的表达式，其他权限相同的元素再判断展示的时候调用同一个方法即可。
3）computed 和 watch 区分使用场景
computed： 是计算属性，依赖其它属性值，并且 computed 的值有缓存，只有它依赖的属性值发生改变，下一次获取 computed 的值时才会重新计算 computed 的值；
watch： 更多的是「观察」的作用，类似于某些数据的监听回调 ，每当监听的数据变化时都会执行回调进行后续操作；
运用场景：
1、当我们需要进行数值计算，并且依赖于其它数据时，应该使用 computed，因为可以利用 computed 的缓存特性，避免每次获取值时，都要重新计算；
2、当我们需要在数据变化时执行异步或开销较大的操作时，应该使用 watch。使用 watch 选项允许我们执行异步操作 ( 访问一个 API )，限制我们执行该操作的频率，并在我们得到最终结果前，设置中间状态。这些都是计算属性无法做到的。
https://www.cnblogs.com/goloving/p/8964602.html
https://www.cnblogs.com/goloving/p/8892919.html
https://www.cnblogs.com/goloving/p/8893073.html
4）Vue 会通过 Object.defineProperty 对数据进行劫持，来实现视图响应数据的变化，然而有些时候我们的组件就是纯粹的数据展示，不会有任何改变，我们就不需要 Vue 来劫持我们的数据，在大量数据展示的情况下，这能够很明显的减少组件初始化的时间，那如何禁止 Vue 劫持我们的数据呢？可以通过 Object.freeze 方法来冻结一个对象，一旦被冻结的对象就再也不能被修改了。
//Object.freeze 方法冻结对象
this.data = Object.freeze(res.data);
5）对路由组件进行懒加载
这里的懒加载是指在访问到对应的组件时才加载它，首屏的时候不加载。这里实现的方法很简单，只要将以前直接import组件的方式改为：const Login = () => import('@/pages/Login’);即可。
Vue 是单页面应用，可能会有很多的路由引入 ，这样使用 webpcak 打包后的文件很大，当进入首页时，加载的资源过多，页面会出现白屏的情况，不利于用户体验。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应的组件，这样就更加高效了。这样会大大提高首屏显示的速度，但是可能其他的页面的速度就会降下来。
import Vue from 'vue'
import Router from 'vue-router'
// import HelloWorld from '@/components/HelloWorld'
Vue.use(Router)
export default new Router({
routes: [
// {
// path: '/',
// name: 'HelloWorld',
// component: HelloWorld
// }
{
path: '/',
name: 'HelloWorld',
component: () => import('@/components/HelloWorld.vue')
}
]
})
6）避免内存泄漏
https://www.cnblogs.com/goloving/p/11267124.html
https://www.cnblogs.com/goloving/p/11266974.html
