Really good video. Made me clearly understand that React is Javascript as if it were to natively support the spreadsheet / reactive programming model. Update a cell, dependent cells / signals get updated automagically. The huge upside is that cells / signals are plain JS values that can be composed using plain JS functions, and all the JS tooling just works.
Technically, this is done by simply using an unique dirty bit, which triggers the recomputation of the rendered scene. Which is fast enough in practice, and even supports unchanged hints to reduce the costs of expensive DOM updates.
This is eerly similar to 3d scene rendering. The unchanged hints are the equivalent of viewport clipping, though require more work from the coder to setup right.
I've been doing a fair amount of Angular development at work and recently been getting into React on the side (and now introducing it for a new project at work!). I'd say they have the same general goal - build your app with declarative and expressive markup. However, Angular tries to shoehorn custom components into the regular DOM, which gets problematic in many cases.
For instance: the directives `ng-show` and `ng-hide` simply apply CSS styles. As far as I know it's not possible to completely remove an Angular component from the DOM and then replace it later (without getting too deep into imperative JS). However, that's trivial to do in React.
Angular chokes on large data sets, probably because it's doing everything directly on the DOM. React handles huge numbers of records effortlessly. Getting comparable performance with Angular requires much more imperative voodoo than I'd like out of an ostensibly declarative system.
I also find it harder to reason about Angular's data flow, since there are many ways to pass things around: nested scope, isolate scope, sibling scope, same scope, dependency injection to name a few. Finding where a particular handler or value comes from is sometimes quite the hunt. With React, it's all pretty much self-contained.
grayrest|11 years ago
[1] http://www.confreaks.com/videos/3221-mwjs-be-predictable-not...
Flux is just Facebook's internal usage pattern. Doesn't really have an Angular equivalent other than the somewhat nebulous Angular best practices.
pacala|11 years ago
Technically, this is done by simply using an unique dirty bit, which triggers the recomputation of the rendered scene. Which is fast enough in practice, and even supports unchanged hints to reduce the costs of expensive DOM updates.
This is eerly similar to 3d scene rendering. The unchanged hints are the equivalent of viewport clipping, though require more work from the coder to setup right.
couchand|11 years ago
For instance: the directives `ng-show` and `ng-hide` simply apply CSS styles. As far as I know it's not possible to completely remove an Angular component from the DOM and then replace it later (without getting too deep into imperative JS). However, that's trivial to do in React.
Angular chokes on large data sets, probably because it's doing everything directly on the DOM. React handles huge numbers of records effortlessly. Getting comparable performance with Angular requires much more imperative voodoo than I'd like out of an ostensibly declarative system.
I also find it harder to reason about Angular's data flow, since there are many ways to pass things around: nested scope, isolate scope, sibling scope, same scope, dependency injection to name a few. Finding where a particular handler or value comes from is sometimes quite the hunt. With React, it's all pretty much self-contained.
optymizer|11 years ago
Wouldn't ng-if be appropriate for this?
sehr|11 years ago
http://www.quora.com/Pete-Hunt/Posts/Facebooks-React-vs-Angu...
http://www.reddit.com/r/javascript/comments/1oo1y8
Though they're both from a member of the React team and might be a little biased, they were very informative.