Is React a victim of its own success?
React stood for the view layer. What does React stand for now?
The glorious past
In the early days of version 0.10, React had a singular motive of being the view only layer for web frontends. It was a timely answer to the huge problem called DOM, to which, the only solution was jQuery, Knockout and Backbone.
React was a breeze. It is the best thing that happened to the frontend JS ecosystem. The virtual DOM was a revolutionary idea. Instead of handling the DOM directly, developers could now work on an abstract level and React would automatically flush the changes down to DOM.
My first React app had a bulky Gulp setup for Common JS module system. It was funny to see how the entire community moved from Grunt to Gulp unanimously.
With the advent of Webpack and CRA, the barrier to entry was practically removed. Now you could be a Frontend Developer without getting into Frontend Ops (Building, Compiling, Transpiling, etc).
We then collided head first with the fundamental problem of state management. The component’s local state was cool, but what happens when components need to share state? What if I don’t want to pass state and modifiers down to children as props?
I (now) sincerely believe that we should have stopped there and sent state down manually as props. Embracing the Linux philosophy of doing one and only one thing. And doing it well.
The rise of state
The demand for a less verbose state management pattern, than passing state down as props, led to an even more verbose state management pattern called Flux.
I rode the first wave of Flux adoption. Since 2015, I’ve written only one frontend application that didn’t depend on a variant of Flux, and more than 5 that did.
Flux got a lot of things right. After all, it was built to solve the problems of one of the most popular properties on the inter-land. State machines made mathematical sense. And I’m a sucker for math-based solutions.
The best part was that Flux was optional. You could use it or not. Then came Redux. Dan Abramov made Flux a no-brainer. It was not as verbose as Flux, had excellent documentation and tooling. It made testing and debugging easier.
You could now manage complex states in a large application with ease. And it was still optional. But it made so much sense to use it. React & Redux became best friends.
I again wish that we should have stopped here. But we didn’t.
Tooling and ecosystem maturity
To an extent, we did slow down at this point. Considerable effort was devoted to making the tooling seamless. Pain around bundling and minification was abstracted away in the form of CRA.
Long-standing bugs were fixed, internal optimizations were made, errors were improved. React became the de-facto standard of frontend dev. React was still a view layer. But not for long.
I wrote medium sized React-Redux apps (with less than 500 components) and it all worked fine. I stopped caring about Webpack and Babel and I liked the new experience. There were some small problems but it was largely going well.
Turning point?!
Before I say anything else, I’d like to point out that I like hooks. It resonates with my thought process and enables me to write code that is more readable and state that is more manageable.
It also lets me do things that were hard or impossible in the early days of React. Like animation (with a clean API), async loading and other optimizations. HOOKS ARE DOPE!!
Hooks make React one of the most promising and feature complete framework that I’ve ever worked with. It’s like a machine gun. It gets things done.
That being said, I liked it more when it was a Katana. I liked it more when it did just one thing well.
There was an HN post whose comment section expresses my stand on React. Whether I deserve to take a stand is highly questionable. Introduction of hooks to the core breaks my mental model of React — the library that did just one thing well.
I don’t think this applies to my development cycle. I like hooks. They work well with Clojure. But I see how it makes hard to onboard new developers to React.
The future
What is React now? Is it a view layer? Is it a state-management system? Or is it an effect-management system? Did we ask too much from a library that was already extremely charitable?
According to the book Positioning by Al Ries and Jack Trout, the human brain stores a product as a simple idea. For example, Google means “search”, Nike stands for “promoting athletes”. Apple stands for “simplicity”. Snapchat is a “camera” company and Tesla is the “best electric car”.
React stood for the view layer. What does React stand for now?
If you’d like to stay updated, please follow me on: Medium, Github or Twitter
You might also like:
