The interesting thing about React

September 1, 2016

React is a JavaScript UI framework that’s gotten pretty popular in the last few years. Due to this popularity, you’ll run across lot of conflicting (and sometimes misleading) descriptions of what React is all about. Most people focus on the functional programming angle, but to me, the most interesting thing about React is its take on object-oriented programming.

Despite what some people say, I think it’s fair to call React “object-oriented”. From Why React? on the React site:

React is all about building reusable components. In fact, with React the only thing you do is build components. Since they’re so encapsulated, components make code reuse, testing, and separation of concerns easy.

To me, the big idea of React is that you do not manipulate the object graph directly. In most OO toolkits, you build a tree of view components in an imperative manner, and manually update the tree as your UI moves through different states. React is much more declarative: each component’s render() method returns a value describing its desired subtrees. Internally, React reconciles the current tree with the desired one — instantiating, modifying, or destroying actual component instances as necessary. This also has the effect of discouraging aliasing (multiple references to the same object), which can be a big source of problems in object-oriented programs.1

Of course, there’s a lot more to React than this, but this feels like the big idea to me. Like most good ideas, this is probably not new, but I can’t remember having seen it before. I think it’s applicable to more than just UIs, so I’m curious to see if we’ll see this pattern start to pop up in other domains.

  1. See Noble et al.’s Flexible Alias Protection for an in-depth discussion of the problems caused by aliasing, and an example of a language-level solution.