Hello everyone, today I would like to share 5 reasons why you should use React. Let’s get started.
1.) The Virtual DOM
First of all, you can think of the DOM
(Document Object Model), which stores all the objects on the web. The unique thing about the DOM
is that it organizes these objects in a tree-like structure as you can see below.
Most frameworks JavaScript
libraries and frameworks JavaScript
use what is called the real DOM
. The problem with the real DOM
, however, is that the entire content must update every time a change in your UI state is top-down. This is a fairly straightforward process, but updating the DOM
repeatedly can slow things down a bit and can be quite expensive, this is where the virtual DOM
comes into being.
DOM
virtual DOM
is basically a copy of the real DOM
, but the virtual DOM
doesn’t really change anything you see on the screen, that’s why it’s so fast. Basically, the virtual DOM
is like taking a screenshot of the real DOM
and then saving it later.
When the virtual DOM
updates, it compares the updated version with the previous version of the virtual DOM
. React
then compares both versions of the virtual DOM
to see what has changed through a process called diff and only applies those changes to the real DOM
.
This way, instead of going through the entire tree and updating each object in it, we only have to update the changed parts. This is one of the big reasons why React
is so fast and why it is gaining so much popularity today.
2.) JSX
JSX
is a syntax used in React
makes web development a lot easier. Basically, JSX
combines elements of both Javascript
and HTML
and puts them together in one package.
1 2 3 | <span class="token keyword">const</span> name <span class="token operator">=</span> <span class="token string">'Alex'</span> <span class="token punctuation">;</span> <span class="token keyword">const</span> jsxExample <span class="token operator">=</span> <span class="token operator"><</span> h1 <span class="token operator">></span> Xin chào <span class="token punctuation">,</span> <span class="token punctuation">{</span> name <span class="token punctuation">}</span> <span class="token operator">!</span> <span class="token operator"><</span> <span class="token operator">/</span> h1 <span class="token operator">></span> <span class="token punctuation">;</span> <span class="token comment">// Xin chào, Alex</span> |
JSX
can also be used in functions, statements, loops, variables, and anywhere you can use regular JavaScript
. You may notice that we still use camel case
when using JSX
, this is because JSX
still more similar to JavaScript
than HTML
. If you want to learn more about JSX
, you can watch this video .
Some developers don’t like to use JSX
but this is nothing to worry about because React
doesn’t force you to use it. If you like, you can continue to use JS
and HTML
as usual so you can think of JSX
as an additional React
feature that can help you speed up development.
3.) React is a Library
Although you can see React
called the JavaScript framework
, it is actually a library, not a framework
. To understand the differences between framework
and libraries, start by thinking about the differences between these two different sandwiches.
You can imagine the framework
called the “skeleton” of both sandwiches. Both have bread on the outside followed by vegetables, cheese and meat on the inside in a top-down order. However, even though both sandwiches have the same structure, you can tell just by looking at them that they will taste quite different due to the different ingredients inside (the library).
So the difference between a framework
and a library is that the framework
structure is already defined before you start while the library is not. This means that a library gives you much greater flexibility and customization than a framework
.
For a bit more technique instead of comparing two different sandwiches, a library basically allows you to control the flow of the application. When you use the library, you are the library caller but when you use the framework
, it will call you. This is called reversal of control.
4.) React is Popular
Over the past few years, React
has exploded in popularity and is currently the No. 1 JavaScript
library available today. Take a look at React
‘s popularity compared to other libraries and frameworks
.
As you can see, basically, no one has ever heard of React
and only a small percentage of those people are not interested in it or will not use it anymore. React
‘s popularity comes from its speed ( Virtual DOM
), reusable components, ease of learning, and a lot of support from the developer community. This also means that if you are looking for a job, React
will be your best choice when it comes to libraries and other frameworks
out there.
5.) Mobile Apps With React Native
Although it’s not quite the same as React
, React Native
allows you to create mobile applications for both Android
and IOS
. The syntax is not exactly the same as the usual React
, however, React Native
still extremely similar and will not take you much time to learn if you are familiar with React
or even just plain JavaScript
.
If you don’t have a Mac
and are interested in creating mobile apps for iOS
, then React Native
is for you. React Native
can also be used for simultaneous development for both iOS
and Android
and is written in JavaScript
and JSX
just like regular React
. React Native
was released back in 2015 and is still quite new and has a lot of room for improvement and expansion. If you want to see React Native
more detail, you can click on this link .
Above are my share, hope can help people. See you all in the next article.
Reference: https://medium.com/javascript-in-plain-english/5-reasons-why-you-should-be-using-react-238373cc245e