如何进行高性能的复杂dom操作

如何进行高性能的复杂dom操作

React速度很快
与其它框架相比，React采取了一种特立独行的操作DOM的方式。
它并不直接对DOM进行操作。
它引入了一个叫做虚拟DOM的概念，安插在JavaScript逻辑和实际的DOM之间。
这一概念提高了Web性能。在UI渲染过程中，React通过在虚拟DOM中的微操作来实对现实际DOM的局部更新。
跨浏览器兼容
虚拟DOM帮助我们解决了跨浏览器问题，它为我们提供了标准化的API，甚至在IE8中都是没问题的。
模块化
为你程序编写独立的模块化UI组件，这样当某个或某些组件出现问题是，可以方便地进行隔离。
每个组件都可以进行独立的开发和测试，并且它们可以引入其它组件。这等同于提高了代码的可维护性。
单向数据流让事情一目了然
Flux是一个用于在JavaScript应用中创建单向数据层的架构，它随着React视图库的开发而被Facebook概念化。它只是一个概念，而非特定工具的实现。它可以被其它框架吸纳。例如，Alex Rattray有一个很好的Flux实例，在React中使用了Backbone的集合和模型。
纯粹的JavaScript
现代Web应用程序与传统的Web应用有着不同的工作方式。
例如，视图层的更新需要通过用户交互而不需要请求服务器。因此视图和控制器非常依赖彼此。
许多框架使用Handlebars或Mustache等模板引擎来处理视图层。但React相信视图和控制器应该相互依存在一起而不是使用第三方模板引擎，而且，最重要的是，它是纯粹的JavaScript程序。
同构的JavaScript
单页面JS应用程序的最大缺陷在于对搜索引擎的索引有很大限制。React对此有了解决方案。
React可以在服务器上预渲染应用再发送到客户端。它可以从预渲染的静态内容中恢复一样的记录到动态应用程序中。
因为搜索引擎的爬虫程序依赖的是服务端响应而不是JavaScript的执行，预渲染你的应用有助于搜索引擎优化。
React与其它框架/库兼容性好
比如使用RequireJS来加载和打包，而Browserify和Webpack适用于构建大型应用。它们使得那些艰难的任务不再让人望而生畏。
不幸的是，目前的JavaScript版本并没有提供一个打包和加载的模块。（在未来的ES6版本上将使用System.import来解决这个问题）。
幸运的是，我们有RequireJS和Webpack这些漂亮整洁的替代品。React是由Browserify构建的，如果你想操作图像资源或者编译Less和CoffeeScript，Webpack或许是一个更好的选择。

我不会~~~但还是要微笑~~~：）