javascript AngularJS 与 ReactJS
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/28151067/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
AngularJS vs ReactJS
提问by Asped
I am deciding which JavaScript framework to use for my new web application. I wanted to use Angular, but recently heard about React. The problem is - I have not found a really good comparison between the both. Most of the articles which do a comparison are "pro-react", and are not a big help comparing, but only showing why react is better. e.g.
我正在决定将哪个 JavaScript 框架用于我的新 Web 应用程序。我想使用 Angular，但最近听说了 React。问题是 - 我还没有找到两者之间真正好的比较。大多数做比较的文章都是“pro-react”，对比较没有太大帮助，只是说明了为什么react更好。例如
https://www.codementor.io/reactjs/tutorial/react-vs-angularjshttp://www.quora.com/Pete-Hunt/Posts/Facebooks-React-vs-AngularJS-A-Closer-Look
https://www.codementor.io/reactjs/tutorial/react-vs-angularjs http://www.quora.com/Pete-Hunt/Posts/Facebooks-React-vs-AngularJS-A-Closer-Look
Any real experience, or comparison which states the pros and cons of both? Thanks for your input
任何真实的经验或比较说明两者的优缺点？感谢您的输入
UPDATE- Maybe a small example would help, how to do the same in both frameworks and compare the pros/cons
更新- 也许一个小例子会有所帮助，如何在两个框架中做同样的事情并比较优点/缺点
Example: I have list of companies in a table. Each row is 1 company, each column is some info about the company (name, address, number of employees..) There are a lot of entries, and I need to do some paging and sorting (server side)
示例：我在表中有公司列表。每行是 1 家公司，每列是公司的一些信息（姓名、地址、员工人数..）有很多条目，我需要做一些分页和排序（服务器端）
回答by Breno Ferreira
I have a reasonable experience with React, and basically none with Angular. So what I'm going to say about Angular is from things I read and heard from other people.
我在 React 方面有合理的经验，而在 Angular 方面基本没有。所以我要说的关于 Angular 的内容来自我从其他人那里读到的和听到的。
React
反应
Pros
优点
- Easy to learn
- Isolated components are easier to maintain
- The "Always Re-render" way of React is nice to keep it easier to understand when things get complex
- Flux is a really good alternative to the MVC pattern. The one-way data flow helps with maintainability and keeping data and DOM elements consistent. Combined with Immutable.JS data structures, it's the cherry on top of the cake :)
- 简单易学
- 隔离组件更易于维护
- 当事情变得复杂时，React 的“始终重新渲染”方式很好地使其更容易理解
- Flux 是 MVC 模式的一个非常好的替代品。单向数据流有助于可维护性并保持数据和 DOM 元素一致。结合 Immutable.JS 数据结构，这是蛋糕上的樱桃:)
Cons
缺点
- Doesn't play nice with DOM manipulation libs (e.g.: jQuery)
- It really changes the way you do things, particularly if you're using Flux, which is good, but it takes a little getting used to.
- I found some cases where the re-rendering every time slows down the app when the components handle a large dataset on the render method. Optimising performance in these cases can get a little bit tricky.
- 不适合 DOM 操作库（例如：jQuery）
- 它确实改变了你做事的方式，特别是如果你使用 Flux，这很好，但需要一点时间来适应。
- 我发现在某些情况下，当组件在渲染方法上处理大型数据集时，每次重新渲染都会减慢应用程序的速度。在这些情况下优化性能可能会有点棘手。
Angular
角
Pros
优点
- Good documentation
- Members of the community are helpful (it's easy to find good answers here on SO).
- Two-way data binding makes some things really easy to implement
- 良好的文档
- 社区成员很有帮助（很容易在 SO 上找到好的答案）。
- 双向数据绑定让一些事情真的很容易实现
Cons
缺点
- Performance issues: To make two-way data binding it has to check for changes in your data model. It also has to parse your HTML to make it's magic work. This slows things down, and, if the app is running on a mobile device, it drains the battery faster
- Logic in spread across HTML and JS: code harder to understand, maintain and debug.
- v2 coming to fix some issues, but making all v1 code obsolete
- 性能问题：要进行双向数据绑定，它必须检查数据模型中的更改。它还必须解析您的 HTML 以使其发挥神奇的作用。这会减慢速度，并且如果应用程序在移动设备上运行，它会更快地耗尽电池电量
- 逻辑在 HTML 和 JS 中传播：代码更难理解、维护和调试。
- v2 即将修复一些问题，但所有 v1 代码都已过时
