Warum wir in React JS nicht verwenden sollten

Wie wir wissen, verwenden wir normalerweise DIV, um einen Container zu erstellen oder mehrere Elemente in ein Element zu packen, und können dann gleichzeitig ein Styling darauf anwenden.

In React JSx verwenden wir üblicherweise div, um mehrere Komponenten darin einzufügen, die als einzelne Komponente zurückgegeben werden.
Wie Sie unten sehen können:

return (
<div> <Home /> <Main /> <Blogs /> <footer />
</div>
)

Wir können das DIV jedoch eliminieren und zusätzlichen Speicherplatz in DOM freigeben.
Hier sind einige Alternativen, die wir anstelle von DIV um die Komponenten herum verwenden können.

React Js Version 16.2 führt eine neue Funktion ein, die Zersplitterung Konzept. Sehen wir uns das genauer an.

Jetzt funktioniert React Fragment genauso wie DIV als Wrapper um Komponenten.
Siehe dieses Beispiel:

return (
<React.Fragment> <Home /> <Main /> <Blogs /> <footer />
<React.Fragment />
)

ODER wir können stattdessen das Snippet des Fragment Shothand-Tags (< > < />) verwenden

das ist genau das gleiche wie

return (
<> <Home /> <Main /> <Blogs /> <footer />
< />
)

Vorteile der Verwendung von Fragmenten:

1. SCHNELL
Wie wir wissen, erstellt das DIV-Tag einen Knoten im DOM und belegt etwas Platz im DOM, aber React. Das Fragment erstellt keinen Knoten im DOM, daher nimmt es keinen Platz im DOM ein
was die Anwendung etwas schneller als gewöhnlich macht.

2. Weniger überladenes DOM
Viele irrelevante Knoten machen den Code chaotisch und schwer lesbar, wenn die Anwendung wächst. da wir mehrere übergeordnete Komponenten mit verschachtelten untergeordneten Komponenten haben könnten, die unseren Code unordentlicher machen und ein Hindernis für das korrekte Debuggen des Codes darstellen. Aber mit Fragment sieht der Code klarer und leichter zu verstehen und zu debuggen.

Fazit:
Die Verwendung von Fragment in der neuesten Version von React wird als bewährte Vorgehensweise angesehen. Die meisten Entwickler achten nicht auf solche Kleinigkeiten, die dazu beitragen könnten, die Anwendungsarchitektur zu zerstören, wenn sie in Zukunft wächst.

Abgesehen davon, dass es keine Ausnahmekriterien dafür gibt, müssen wir das DIV verwenden, um einige Klassen hinzuzufügen und ihm Stil zu verleihen.

Vielen Dank für deine Unterstützung. Folgen Sie und teilen Sie sie mit Ihren Kollegen.
Bleiben Sie dran für kommende Artikel wie diesen.

Pass auf dich auf! Bleib Fröhlich!

• SEO-gestützte Content- und PR-Distribution. Holen Sie sich noch heute Verstärkung.
• Platoblockkette. Web3-Metaverse-Intelligenz. Wissen verstärkt. Hier zugreifen.
• Quelle: https://www.codementor.io/rizatech/why-we-shouldn-t-use-div-in-react-js-23a34159bv