总览

React 的概念非常火，今日有幸听点评的前端工程师张强做的分享，进行了总结

优点

• 组件化，可重用
• 通过虚拟 DOM 来实现高性能
• 数据变化驱动 UI 构建-flux

组件化

React 被细化成各个模块，可以充分实现重用，react-native 的推出，让 react 拥有了成为 java 的可能，即工程师只需要编写一次 js。而这段 js 与 native 的对应只需要交给大牛即可。

虚拟 DOM

浏览器的资源在页面 DOM 树发生改变时，会进行重新与 css 树的计算以及重绘，这是非常消耗资源的，而 react 则在外面包了一层虚拟的 DOM 树，即我们的操作实际上是在虚拟的 DOM 树上进行，什么时候渲染页面是由 react 来控制的。

这里还有对于速度的优化在于，React 重新实现了事件，对于我们是无感的，但是 react 仅仅只对 html 进行了事件的监听，然后直接通过元素的 id 来进行快速的调用。

数据变化驱动 UI

UI 并不关心如何逻辑，他只看着 this.states，这个变了，他就会重新渲染页面。这里的渲染替换规则是可控制的，默认直接全部替换，但是我们可以通过 react 提供的方法来减轻。

React

这个库很大，大约 1 万多行，但是非常强大，执行的效率非常高，给了前端大型项目的控制的可能。

React 小优点(自己总结的)

提供了性能分析的插件来让我们做优化。

他让各个组件分离开来，我们可以很放心的修改我们组件的代码。

React 最重要的优点

• 申明式的编程，只要保证了数据，展示就是正确的
• 封装，我们想要调用组件的方法，除非真正的浏览器触发，就只能通过 refs 来触发，杜绝了相互影响

最佳实践

• 少用生命周期函数，说是生命周期函数取这么长就是不想让人用的，尽量在 render 里面写，因为 react 的一大原则就是 Javascript 比你想象中运行的快，如果真的遇到了性能问题，减少 render 调用，生命周期函数都是应急的时候？？
• 尽量都用 stateless 组件？？
• 设置完整的 propTypes

---

转载请注明来源，欢迎对文章中的引用来源进行考证，欢迎指出任何有错误或不够清晰的表达。可以在下面评论区评论，也可以邮件至 981909093@qq.com