Vue与React的相同点与不同点，以及性能优化

相同点：

1. 都是vdom(虚拟dom)去操作dom
2. 都支持组件化
3. 都是数据驱动视图
4. 都支持服务端渲染

不同点：

1. react使用jsx，拥抱js；vue使用的是模板拥抱html
2. react是函数式编程（setState）；vue是声明式编程（data.a = 10;data.b = 20）；针对数据变化的监听，针对触发组建更新的方式，思路不同。
3. vdom不一样，vue会跟踪每一个组件的依赖关系，不需要重新渲染整个组件树，而对于reacte而言每当应用的状态改变时，全部子组件间都会被重渲染（所以react需要更多的自力更生，比如：对shouldComponentUpdate这个生命周期函数的覆写）
4. react属于单向数据流，mvc模式，vue是双向数据绑定，MVVM模式

react性能优化：

1. 覆写shouldComponentUpdate
2. PureComponent和React.momo(针对函数组建)，实现浅比较
3. 设计数据结构State时层级要少
4. 不可变值，immutable.js是基于数据共享，不是深拷贝，速度快。但是有一定的学习和迁移成本，按需使用。
5. 渲染列表时要加业务唯一key
6. 自定义dom事件要及时销毁
7. 合理使用异步组件
8. 减少函数bind this的次数，统一到constructor中写

vue性能优化：

1. 合理使用v-show，v-if
2. 合理使用computed
3. v-for时要加key
4. 自定义dom时要及时销毁
5. 合理使用异步组件
6. 合理使用keep-alive
7. data层级要少
8. 使用vue-loader在开发环境做预编译

webpack层面的优化

优化产出代码：

1. 前端通用的性能优化：图片懒加载；
2. 小图片用base64编码；
3. bundle加hash
4. 提取公共代码
5. 使用CDN加速
6. Ignore plugin
7. 使用production
8. 使用Scope Hosting

优化打包构建速度：

1. 优化babel loader，开启缓存，明确范围
2. IgnorePlugin
3. noParse
4. happyPack(多进程打包工具)
5. ParallelUglifyPlugin，开启多进程进行代码压缩js，webpack内置的uglify工具压缩js是单线程，开启多进行压缩更快
6. 自动刷新-->热更新 （刷新会清空内存，速度较慢，开启热更新网页不刷新，状态不会丢失，但是也有相应成本：需要自行配置那些模块需要热更新以及做什么事，所以这个按需使用）
7. DLLPlugin，动态链接库，没有必要每次都打包，事先把第三方库打包好之后作为DLL来引用。

关于多进程：如果项目大，打包慢，开启多进程会提高速度。

                      如果项目小，打包快，开启多进程会降低速速。

（so按需使用）