vue 和 react 渲染的区别
模板渲染方式的不同
在表层上, 模板的语法不同, React 是通过 JSX 渲染模板. 而 Vue 是通过一种拓展的 html 语法进行渲染, 但其实这只是表面现象, 毕竟 React 并不必须依赖 JSX.
在深层上, 模板的原理不同, 这才是他们的本质区别: React 是在组件 JS 代码中, 通过原生 JS 实现模板中的常见语法, 比如插值, 条件, 循环等, 都是通过 JS 语法实现的, 更加纯粹更加原生. 而 Vue 是在和组件 JS 代码分离的单独的模板中, 通过指令来实现的, 比如条件语句就需要 v-if 来实现对这一点, 这样的做法显得有些独特, 会把 HTML 弄得很乱.
举个例子, 说明 React 的好处: react 中 render 函数是支持闭包特性的, 所以我们 import 的组件在 render 中可以直接调用. 但是在 Vue 中, 由于模板中使用的数据都必须挂在 this 上进行一次中转, 所以我们 import 一个组件完了之后, 还需要在 components 中再声明下, 这样显然是很奇怪但又不得不这样的做法.
渲染过程不同
Vue 可以更快地计算出 Virtual DOM 的差异, 这是由于它在渲染过程中, 会跟踪每一个组件的依赖关系, 不需要重新渲染整个组件树.
React 在应用的状态被改变时, 全部子组件都会重新渲染. 通过 shouldComponentUpdate 这个生命周期方法可以进行控制, 但 Vue 将此视为默认的优化.
如果应用中交互复杂, 需要处理大量的 UI 变化, 那么使用 Virtual DOM 是一个好主意. 如果更新元素并不频繁, 那么 Virtual DOM 并不一定适用, 性能很可能还不如直接操控 DOM.
更多前端开发 https://www.html.cn/ 知识, 请查阅 HTML 中文网 !!
来源: http://www.css88.com/qa/vue-js/16015.html