16. Vue 的 nextTick 的原理是什么？

对这一点，我个人比较喜欢 React 的做法，因为他更加纯粹更加原生，而 Vue 的做法显得有些独特，会把 HTML 弄得很乱。举个例子，说明 React 的好处：react 中 render 函数是支持闭包特性

的，所以我们 import 的组件在 render 中可以直接调用。但是在 Vue 中，由于模板中使用的数据都必须挂在 this 上进行一次中转，所以我们 import 一个组件完了之后，还需要在 components中

再声明下，这样显然是很奇怪但又不得不这样的做法。

1. Vue 的 nextTick 的原理是什么？

1）为什么需要 nextTick Vue 是异步修改 DOM 的并且不鼓励开发者直接接触 DOM，但有时候业务需要必须对数据更改--刷新后

的 DOM 做相应的处理，这时候就可以使用 Vue.nextTick(callback)这个 api 了。

2）理解原理前的准备首先需要知道事件循环中宏任务和微任务这两个概念(这其实也是面试常考点)。

常见的宏任务有 script, setTimeout, setInterval, setImmediate, I/O, UI rendering

常见的微任务有 process.nextTick(Nodejs),Promise.then(), MutationObserver;

3）理解 nextTick 而 nextTick 的原理正是 vue 通过异步队列控制 DOM 更新和 nextTick 回调函数先后执行的方式。如果

大家看过这部分的源码，会发现其中做了很多 isNative()的判断，因为这里还存在兼容性优雅降级的问题。可见 Vue 开发团队的深思熟虑，对性能的良苦用心。

1. Vuex 有哪几种属性?

有五种，分别是 State、 Getter、 Mutation、 Action、 Module

18. vue 首屏加载优化

把不常改变的库放到 index.html 中，通过 cdn 引入，然后找到 build/webpack.base.conf.js 文件，在 module.exports = { } 中添加以下代码

externals: { 'vue': 'Vue',

'vue-router': 'VueRouter', 'element-ui': 'ELEMENT',

},

这样 webpack 就不会把 vue.js, vue-router, element-ui 库打包了。

vue 路由的懒加载

import 或者 require 懒加载。

不生成 map 文件

找到 config/index.js，修改为 productionSourceMap: false