Do not Use <div> in React

We all use <div> everytime when we work in react to wrap elements inside one element.

In React JSX,
To return multiple components or elements we have to wrap and group and all the elements inside a wrapper like div

But in the most of cases that div is not required at all and it takes an extra space in the DOM but still we have to use it because thats how React works

so React introduces a new feature in React 16.2 which are React Fragments

Now React Fragments works exactly like Div
You can wrap or group with Fragments

Also u can use Fragments shorthand (<> </>) instead of React.Fragments

But why to use Fragments ?

1.fast

Div element creates a ode in DOM and occupy some space but React Fragments never creates any node in DOM and never occupy any space which makes the app tiny bit faster

2.Less cluttered DOM

Having lots of nested div makes the DOM large and hard to read or debug but with Fragments, DOM become a little easy to look at and debug