ہمیں React JS میں کیوں استعمال نہیں کرنا چاہیے۔

جیسا کہ ہم جانتے ہیں، ہم عام طور پر DIV کا استعمال کنٹینر بنانے یا ایک عنصر کے اندر متعدد عناصر کو لپیٹنے کے لیے کرتے ہیں اور پھر ان پر ایک ساتھ اسٹائل لگا سکتے ہیں۔

React JSx میں، ہم عام طور پر div کو اس کے اندر ایک سے زیادہ اجزاء ڈالنے کے لیے استعمال کرتے ہیں تاکہ ایک جزو کے طور پر واپس آ سکیں۔
جیسا کہ آپ نیچے دیکھ سکتے ہیں:

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

اگرچہ، ہم DIV کو ختم کر سکتے ہیں اور DOM میں کچھ اضافی جگہ خالی کر سکتے ہیں۔
یہاں کچھ متبادل ہیں جو ہم اجزاء کے ارد گرد DIV کے بجائے استعمال کرسکتے ہیں۔

React Js ورژن 16.2، ایک نیا فیچر متعارف کرایا ہے۔ فریجمنٹ تصور آئیے اس میں مزید گہرائی سے دیکھیں۔

اب React Fragment بالکل ویسا ہی کام کرتا ہے جیسا کہ DIV اجزاء کے ارد گرد ریپر کی طرح۔
یہ مثال دیکھیں:

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

یا ہم اس کے بجائے فریگمنٹ شاٹ ہینڈ ٹیگ (< > < />) کا ٹکڑا استعمال کرسکتے ہیں۔

یہ بالکل اسی طرح ہے

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

ٹکڑا استعمال کرنے کے فوائد:

1. تیز
جیسا کہ ہم جانتے ہیں کہ DIV ٹیگ DOM میں ایک نوڈ بناتا ہے اور DOM میں کچھ جگہ رکھتا ہے، لیکن React۔ ٹکڑا DOM میں نوڈ نہیں بناتا، لہذا یہ DOM میں کوئی جگہ نہیں لے گا۔
جو درخواست کو معمول سے تھوڑا تیز بناتا ہے۔

2. کم بے ترتیبی DOM
بہت سے غیر متعلقہ نوڈس کا ہونا کوڈ کو گندا اور پڑھنا مشکل ہو جاتا ہے جب ایپلیکیشن بڑھ جاتی ہے۔ جیسا کہ ہمارے پاس نیسٹڈ چائلڈ کمپوننٹ کے ساتھ ایک سے زیادہ پیرنٹ کمپوننٹ ہوسکتے ہیں، جو ہمارے کوڈ کو گڑبڑ بناتے ہیں اور کوڈ کو صحیح طریقے سے ڈیبگ کرنے میں رکاوٹ بن جاتے ہیں لیکن فریگمنٹ کے ساتھ، کوڈ زیادہ واضح اور سمجھنے اور ڈیبگ کرنے میں آسان نظر آتا ہے۔

نتیجہ:
React کے تازہ ترین ورژن میں Fragment استعمال کرنا ایک اچھا عمل سمجھا جائے گا۔ زیادہ تر ڈویلپر اس طرح کی چھوٹی چیزوں پر توجہ نہیں دیتے ہیں، جو مستقبل میں بڑھنے پر ایپلیکیشن آرکیٹیکچر کو تباہ کرنے میں مدد دے سکتی ہے۔

سوائے اس کے کہ اس کے لیے کوئی غیر معمولی معیار نہیں ہے ہمیں کچھ کلاسز کو شامل کرنے اور اس میں انداز شامل کرنے کے لیے DIV کا استعمال کرنا ہوگا۔

آپ کے تعاون کا بہت بہت شکریہ۔ فالو کریں اور اپنے ساتھیوں کے ساتھ شئیر کریں۔
اس طرح کے آنے والے مضامین کے لیے دیکھتے رہیں۔

محفوظ رہو! خوش رہو!

• SEO سے چلنے والا مواد اور PR کی تقسیم۔ آج ہی بڑھا دیں۔
• پلیٹو بلاک چین۔ Web3 Metaverse Intelligence. علم میں اضافہ۔ یہاں تک رسائی حاصل کریں۔
• ماخذ: https://www.codementor.io/rizatech/why-we-shouldn-t-use-div-in-react-js-23a34159bv