Hvorfor vi ikke bør bruge i React JS

Hvorfor vi ikke bør bruge i React JS

Tidsstempel: 27. marts 2023 kl. 11:50
Kildeknude: 2035537

Som vi ved, bruger vi typisk DIV til at lave en beholder eller vikle flere elementer inde i et element og derefter påføre styling på dem på én gang.

I React JSx bruger vi almindeligvis div til at sætte flere komponenter inde i det for at vende tilbage som en enkelt komponent.
Som du kan se nedenfor:

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

Selvom vi kan fjerne DIV og frigøre noget ekstra plads i DOM.
Her er nogle alternativer, som vi kan bruge i stedet for DIV omkring komponenterne.

React Js version 16.2 introducerer en ny funktion Fragmentering koncept. Lad os se nærmere på det.

Nu fungerer React Fragment nøjagtigt det samme som DIV som en indpakning omkring komponenter.
Se dette eksempel:

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

ELLER vi kan bruge fragmentet Fragment shothand tag (< > < />) i stedet for

dette er nøjagtig det samme som

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

Fordele ved at bruge Fragment:

1. HURTIG
Som vi ved, opretter DIV-tag en node i DOM og optager noget plads i DOM, men React. Fragmentet opretter ikke en node i DOM, så det tager ikke plads i DOM
hvilket gør påføringen en smule hurtigere end normalt.

2. Mindre rodet DOM
At have mange irrelevante noder gør koden rodet og svær at læse, når applikationen vokser. da vi kunne have flere overordnede komponent med indlejret underordnet komponent, som gør vores kode mere rodet og bliver en barriere for at fejlfinde koden på en ordentlig måde. Men med Fragment ser kode mere klar og nem at forstå og fejlfinde.

konklusion:
Brug af Fragment i den seneste version af React vil blive betragtet som en god praksis at følge. De fleste udviklere er ikke opmærksomme på små ting som dette, hvilket kan være med til at ødelægge applikationsarkitekturen, når den vokser i fremtiden.

Bortset fra, at der ikke er nogen ekstraordinære kriterier for, at vi skal bruge DIV til at tilføje nogle klasser og tilføje stil til det.

Mange tak for din støtte. Følg og del med dine kolleger.
Hold øje med kommende artikler som denne.

Pas på dig selv! Forbliv glad!

Tidsstempel:

Mere fra Kodementor-reaktionsfakta