中大型项目可以用 react,react 比较适合大型项目.
原因:
1, 大型项目的庞大带来的是代码优化以及性能优化
react 提倡的更细粒度的封装, 带来的组件的复用性提高.
更高自由度的编写 (几乎无 API) 可以为手动优化性能带来更大的便利性
2,react 社区的活跃性
这点会反复提及, 因为这点更加重要
社区提供了多样性的解决方案和更多的选择, 这对于一个大型项目 (大量的坑) 来说也是至关重要的
拓展:
react 和 vue 的区别
1, 设计思想上的区别(数据是不可变的)
vue 的思想是响应式的, 也就是基于是数据可变的, 通过对每一个属性建立 Watcher 来监听, 当属性变化的时候, 响应式的更新对应的虚拟 dom.
把组件设计成纯组件, 状态和逻辑通过参数传入, 所以在 react 中, 是单向数据流, 推崇结合 immutableJs 来实现数据不可变
react 中数据都是进行手动更改达到视图更新, 而 vue 是响应式的进行更改.
2, 通过 JS 来操作一切, 还是用各自的处理方式
react 的思路是 all in JS, 通过 JS 来生成 html, 所以设计了 jsx, 还有通过 JS 来操作 CSS, 社区的 styled-component,jss 等,
vue 是把 HTML,CSS,JS 组合到一起, 用各自的处理方式, vue 有单文件组件, 可以把 HTML,CSS,JS 写到一个文件中, HTML 提供了模板引擎来处理.
3, 类式的组件写法, 还是声明式的写法
react 是类式的写法, API 很少, 也有傻瓜组件的函数式写法
而 vue 是声明式的写法, 通过传入各种 options,API 和参数都很多.
所以 react 结合 typescript 更容易一起写, vue 稍微复杂. 不过 vue3.0 也全面支持 typescript. 而且 vue3.0 也更加趋向于 react 了. 这一点在 2019 年年末推出的 vue3.0 先行版本已经体现. 所以这一点也不在是区别, 而是共同点
4, 组件封装(扩展)
react 的高阶组件 hoc 进行封装, react 提倡精度更细, 纯渲染的的组件封装, 也就是什么都交给 JS 去做
vue 使用 mixins 进行扩展
5, 社区活跃
react 做的事情很少, 很多都交给社区去做
vue 很多东西都是内置的, 写起来确实方便一些,
接下来说一些更细致的区别, 也可以说是它们的缺陷, 也是对上述几点的补充
1, 复用组件
react 不太适合复杂逻辑. 代码复杂性随着内联模板和 JSX 的增加而增加. 如果有太多的小组件可能增加项目的庞大和复杂
vue 在这点做的很好. 但是 vue 的数据双向绑定 (响应式) 导致数据的稳定性不足, 过多的数据会产生过多的 watch, 从而导致性能上降低.
vue2.0 + 和 react 都是单向数据流, 只不过 vue 实现了数据双向绑定的语法糖, 不要混淆了同志们.
2, 入门难度
vue 对于新手比较友好. react 有一个学习曲线.
react 也比较趋向于面向对象写法.
3, 性能优化
vue 的性能上相比与 react 还是比较高效的. 例如 react 在渲染的时候对将组件以及后代组件全部重新渲染, 当然也不是完全重新渲染, 但是这种对比不同点渲染又会带来新的性能损耗.
而 vue 的更新要比 react 粒度要更细也更加不用去人为的关心,
虽然 react 可以使用 shouldComponentUpdate 和 pureComponent 帮助我们对此进行优化, 但仍然不及 vue 性能
但是 react 的手动性能优化要强于 vue, 因为 react 编写自由度更高
4, 代码量
react 的高自由度也代表的开发功能的复杂性, 几乎所有的功能逻辑都需要自己手动编写, 这无疑提升的项目成本
vue 虽然有些功能不够完善, 但是自己开发设计也不会太过困难.
vue 生产打包体积更小, 实现功能的代码也要比 react 少.
5, 渲染机制(对于第三点的补充)
vue 的订阅机制能够明确知道哪个 value 发生了改变, 然后只重新渲染该部分即可
react 只要调用的 setState 就会触发 render 重新渲染, 甚至视图什么数据都没使用, 它不关心也不知道是哪个数据发生了改变. 当组件或节点比较多的时候, 更新数据可能会造成很多不必要的虚拟 DOM 的构建, 庞大的节点树也拖慢了 diff 的速度, 这时就需要引入一些优化方案, 比如 PureComponent 配合 ImutableJS, PureComponent 利用 props 和 state 属性的浅对比来决定要不要重渲染, 如果浅对比结果是相等, 则组件及其子组件不参与重渲染.
更多 web 前端 https://www.html.cn/ 知识, 请查阅 HTML 中文网 !!
来源: http://www.css88.com/qa/react/17721.html