I did a hackathon this month where my team planned to build a crud-like web app. We decided to go with react(along with other stuff under react umbrella) and golang. As easy the project might sound we took one of the complex(read hipster) technologies for building the MVP. Being ambitious, stubborn and stupid we couldn’t present the MVP.
Later I though about it and tried to reason about using react. I thought to myself hey may be it’s because of the reusable components; but wait 🤔
web components also does that. Maybe it’s because of the data handling it does … or maybe their reconciliation algorithm is super fast!
This post focuses on the problems that react tries to solve.
What is React
React is a library for building composable user interfaces.
Problems react tries to solve
React really shines when your data changes over time.
React on the other hand
renders your markup efficiently by using their diff-ing algorithm(a.k.a reconciliation) which only updates the necessary part of the actual DOM.
Because this re-render is so fast (around 1ms for TodoMVC), the developer doesn’t need to explicitly specify data bindings.
Reactive programming: this is one of those phrases that threatens to become meaningless with overuse, but it’s a useful concept. Put simply, in a reactive system where the value of b depends on the value of
a changes then
b will also change. Applied to user interfaces, that means that when your application state changes, your view also changes. With traditional MVC libraries you typically have to implement all your render logic manually and wire it up with a web of publish/subscribe events; with React you’re spared that (tedious, error-prone, hard-to-optimise) step when building your apps.
🔥 ⚡ They are building react fiber which is a reimplementation of their core algorithm(including reconciliation algorithm).
My takeout from this ‘research’(!) is if you’re building a data extensive SPA where you need to react to user interaction; using react would give you some major advantage over traditional tech stack.