Billed as a JavaScript library for building user interfaces, React is a Facebook- and Instagram-driven project that is providing the "view" part of the MVC (model-view-controller) development paradigm. It was created to enable developers to build large applications with data that changes.
Work on React began around late 2011, and the technology was open sourced a year ago. Sometimes identified as ReactJS, the current version is 0.10. Proponents argue that React challenges a lot of conventional wisdom and that some ideas at first might seem crazy. InfoWorld Editor-at-Large Paul Krill recently spoke with Pete Hunt, a core member of the React development team, about the technology.
InfoWorld: What distinguishes React from other JavaScript frameworks, such as AngularJS or the Meteor platform?
Hunt: Over the past couple of years, we've seen a shift toward what we like to call reactive programming. Meteor and Angular are examples of that. When your data updates, your UI is automatically updated to reflect that, and the system manages that for you. The difference with React is the way that you program it is much more like a game engine, as opposed to these alternative approaches, with data-binding. With a game engine, effectively what happens is the screen is cleared at the beginning of every frame, and then you redraw the scene. With a traditional data-binding approach you have live widgets on the screen, and you manipulate them, and they stay on the screen the entire time. So the terminology for this is that React is an immediate-mode renderer, and other systems could be considered a retained mode.
InfoWorld: Doesn't React provide the view portion of the MVC paradigm?
Hunt: If you're using model-view-controller, you can definitely think of React as the view part of that and many people think of it as the controller as well. But since there are lots of different interpretations of model-view-controller, it's not a black or white kind of thing. But definitely the view, probably the controller.
InfoWorld: What's the story pertaining to React and the DOM?
Hunt: The browser itself is retain mode. You click an HTML element on the screen, and then you change it over time. The programming model we wanted for React was basically to throw out and redraw everything. We think that's easier to understand. However, the browser is not designed to work like that. What we did is we built something that we're calling the virtual DOM to abstract that. And so we have a way of basically rendering to a virtual DOM, throwing out the whole virtual DOM and re-creating it every time the data changes, and then React under the hood will convert that, will get the old virtual DOM with the new virtual DOM and then convert that to manipulations of the real browser DOM.
InfoWorld: I'm looking at a blog entry from James Long of Mozilla, entitled, "Removing user interface complexity, or why React is awesome." It reads, "I've been studying frameworks and libraries like Amber, Angular, and React, etc., and I'm mostly concerned with the core problems of data binding and componentizing UIs. After much research and uses of the technologies above, I found React to provide the best solution." Does he say what you're you're trying to accomplish here?
Hunt: Yes. He definitely gets it.
InfoWorld: Can you tell me about a road map for React, where you go from here and when you might have a formal 1.0 release?
