With Backbone views (for example), it's usually cumbersome to update certain pieces of a view to make sure they stay in sync with your underlying model data. Y

With Backbone views (for example), it's usually cumbersome to update certain pieces of a view to make sure they stay in sync with your underlying model data. You can just reset the HTML from scratch using something like a Handlebars template (or even just building the HTML by hand), but if you have a large DOM tree, that's slow because the browser needs to recreate all the nodes. Alternatively, you can look up each piece of the UI using jQuery and update it by hand (like $(".points").text(newPoints)), but that's cumbersome because you now have to define what the UI looks like in two places (once in the initial render, once in the update function) where they can get out of sync. React lets you define interfaces declaratively (as if you were just recreating all the HTML each time) but uses a fast internal representation of the DOM that it diffs against the previous copy so that it knows exactly when and how to modify the DOM, keeping things fast.