Thinking React core in a different way

Minhazul Abedin
3 min readMay 15, 2021

Introduction:

In a Line, React is a JavaScript library, that's built User Interfaces(UI).
Many peoples say, it’s a framework, but it’s false. React JS is an Open-source library.
Actually, Frameworks are great things. A framework is a complete & clear path, that’s ready & works with his pattern as that’s building way.
But the framework has a lot of disadvantages. A framework is not flexible, It’s forced to moving you, in his way or pattern.
Otherside, Library is flexible. if you realize it’s needed, then you can use it. otherwise, you can work with your own pattern. It helps you to grow up you to a Wonderful programmer.

So long you know about the first part of React definition. Now, I want to talk about the UI(User Interfaces) of React.
Actually, User Interface is that thing, which is we can see in the browser. it’s a front part. React js can build that's User interface whatever you want.

Why React is most popular:

Nowadays, Huge ways(framework & library) to create Complete user Interfaces. From lots of Options, React stands up & gives the most efficient ways to build user interfaces. It helps save time & code for developers. If it’s work with a very large size Web app, then React can completely show his ability power. React works with his own pattern. It’s a very smart thing. React create a virtual DOM that can be used to reconcile the actual DOM.

Why DOM is Working slowly or Not:

DOM is Document Object Model. DOM API can change document structure, style & all contents.
Some people say, DOM is very slow for reading and write operation on the website from Browser DOM. DOM is a Document Object Model.
The actual True is DOM is fast enough. it’s like setting a property on JavaScript Object, Nothing else. But, After DOM operation browser repaints UIs and shows us. This process is very slow. After Every DOM Operation, It’s represented as a tree structure, then Browser needs to repaint all the things.
Therefore, repainting more items, to slow your web app.

Thinking way of React (Virtual DOM):

When everyone works with DOM API, that time React Come & introduced to us in a different way. That makes his unique & most powerful things and Day by day make the most popular & valuable Things to create UIs.
Virtual DOM is a replica of DOM, that’s created with a vanilla JavaScript Object. It’s can record & compare changes of DOM operation for before and after changes.
Virtual DOM takes data from DOM that you can change, then it’s created another DOM with all the changed data.
React can compare between two states. that is before state & after a state of changes. Then finally repaint just changes the state(data) in the browser. It’s changes data if that’s the particular node with diffing or reconciliation algorithm to search & updated.
In a sentence, React updated & repaint only that particulars state(data) whatever you want. It’s not reloaded or repaints all of the data.
For this reason, This makes react is very special & the best performer for created User Interfaces.

--

--