Hi Folks, It's 2021, We all agree on the fact that React Came out as the most popular Library in JavaScript Scene for Good Enough Time. In my reasoning It came on top Because, It was meant for scale people at Facebook, Designed It in a way that really solves a critical problem, of all the models of time, Which is Re Rendering on the smallest of changes that occur some where deep inside the Tree. This use to cause Cascading Changes in DOM, Which would make code unreliable for Devs to Change on, Nobody would be interested to do changes in such a messy system, Which in turn causes Dev Processes so slow down.
Now that you have Heard the Story lets look, In to Tech that Enabled this, If you go to React's Home page you would see the Following things
Declarative
To understand this we need to Understand what's the Difference between a declarative and imperative way of doing Things.
In a Nutshell, We can say that, We are choosing to Loose control over Control Flow to make our code more Reusable and Performant , There's a Saying that you take better decisions by not Taking decisions at all.
For getting More detailed Perview Head on to
So yeah, They Unknowingly choose this way of doing Things.
Component Based System
FaceBook had Been Playing around with these sort of things for a long till they got to React, They had a php Extension called Xhp, Which got you out from the hassle of Opening and closing <?php> Tags all around the code
They introduced a New type of Syntax where they passed Html elements as functions. It worked out great for them. The Above extension also had a feature of Making Components, Which directly impacted the contributed to the creation of Component based System.
Virtual Dom
Before understanding Virtual Dom, Lets get hang of DOM. It stands for Document object model, It basically represents the UI of the whole App as a Tree Data Structure. It all works Fine and good until you add Complex Functionality to the App. To solve this What React Developers Did Was they introduced a Virtual Dom which Calculates and Process everything that Real Dom would do whenever a change happens. And choose a way in which Least manipulation will Happen in the DOM and Hence Cause a Better end User Experience
Server Side Rendering
Its is one of those Features That Comes out of the box in React, What happens here is the app Pre Renders the Whole HTML of the Page and Sends it to the Client, Reducing the Render Cost that comes on to the user, It also Is used Heavily when we are interacting with constantly changing data, These Days People are Using NexT.js and NuxT.js For Complex Apps. Which Work on the Above Principle
This Sums Up the Core Features of React, I think Nothing Can Go as Big as React, Without the contribution from community
Which Caused it become How Popular it is today, Of course It Wouldn't have been possible without the Opensource Community we have around it.
Top comments (3)
We are in 2021, Still talking about React Virtual DOM?
is it so bad? Plz Elaborate.
No, just kidding :) I am also checking react-reconciler code, once in a while.