2018 میں AngularJS VS رائے کے درمیان موازنہ

اس مضمون میں ، ہم فرنٹ اینڈ ڈویلپمنٹ کے لئے 2 انتہائی مقبول ٹکنالوجیوں کا موازنہ کر رہے ہیں: کونیی اور رد عمل۔ ہم ان کا موازنہ منصوبے کے معمار اور ڈویلپرز کے نقطہ نظر کے ساتھ ساتھ کمپنیوں کے نقطہ نظر سے کرتے ہیں۔

آج کل انگوٹی اور رد عمل کا موازنہ کرنا بہت مشہور موضوع ہے۔ ری ایکٹ اور اینگولر دونوں انتہائی اعلی درجے کی ، وسیع پیمانے پر اختیار کی جانے والی جاوا اسکرپٹ ٹکنالوجی ہیں جن کا استعمال ہم قبول ویب ایپس اور انٹرایکٹو سنگل پیج ایپلی کیشنز کو بنانے کے لئے کرتے ہیں۔ تیزی سے ایک صفحے والے ایپلی کیشن (ایس پی اے) کی ترقی کے لئے جاوا اسکرپٹ ٹولز کی تعداد مسلسل بڑھ رہی ہے ، لہذا ویب ڈویلپرز کے لئے صحیح فریم ورک کا انتخاب زیادہ مشکل ہے۔

انگولر جے ایس (فریم ورک) اور ری ایکٹ (لائبریری) کے مابین اہم اختلافات مطابقت ، ڈیٹا بائنڈنگ ، کارکردگی ، انحصار ریزولوشن ، ہدایت اور ٹمپلٹنگ ہیں۔ آئیے ان میں سے ہر ایک پہلو کو تفصیل سے دیکھیں۔

AngularJS

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

رد .عمل

رد عمل کو فیس بک نے تیار کیا اور برقرار رکھا ہے اور انسٹاگرام اور واٹس ایپ جیسی مصنوعات میں بھی استعمال کیا جاتا ہے۔ ابھی تقریبا a ساڑھے چار سال ہوچکے ہیں ، لہذا یہ بالکل نیا نہیں ہے۔ یہ گٹ ہب پر ایک مشہور پروجیکٹ میں سے ایک ہے ، لکھنے کے وقت تقریبا about 92،000 ستارے ہیں۔ مجھے اچھا لگتا ہے۔

مطابقت پذیری

AngularJS

انگولر جے ایس کی ایک انتہائی پیچیدہ اور فکسڈ ڈھانچہ ہے کیونکہ یہ واحد صفحے ایپلی کیشنز کے مخصوص ماڈل-دیکھیں-کنٹرولر فن تعمیر پر مبنی ہے۔ AngularJS میں ایک آبجیکٹ کا دائرہ کار ماڈل حص forہ کے لئے ذمہ دار ہے ، جسے کنٹرولر نے ابتدا کیا ہے اور پھر استعمال کنندہ کے لئے نظریہ بنانے کے لئے HTML میں تبدیل ہوجاتا ہے۔ AngularJS بہت ساری معیاری خدمات ، فیکٹریاں ، کنٹرولرز ، ہدایت نامہ اور دیگر اجزا فراہم کرتا ہے۔

ہم AngularJS میں کوڈ کو کئی فائلوں میں توڑ دیتے ہیں۔ مثال کے طور پر ، جب ہم اپنی ہدایت ، کنٹرولر اور ٹیمپلیٹ کے ساتھ دوبارہ قابل استعمال جزو تشکیل دیتے ہیں تو ہمیں ہر ایک کوڈ کو الگ فائل میں بیان کرنا ہوگا۔ ایک بار جب ہم اپنی ہدایت بیان کرتے ہیں تو ، پھر ہم ان حصوں کو جوڑنے کے لئے ہدایت میں اپنے ٹیمپلیٹ کا لنک جوڑ دیتے ہیں۔ AngularJS ہدایت آپ کی درخواست کے لئے ٹیمپلیٹ منطق کی نمائندگی کرتی ہے۔ ٹیمپلیٹ AngularJS ہدایت کے ساتھ HTML میں بڑھا ہوا ہے ، عام طور پر ٹیگ یا اوصاف کے بطور لکھا جاتا ہے۔ ہم اپنے ماڈل کو ضروری necessary دائرہ کار یا سیاق و سباق فراہم کرنے کے لئے بھی کنٹرولرز شامل کرتے ہیں۔ کنٹرولرز الگ فائلوں میں بھی لکھے جاتے ہیں۔ جب ہم اپنی درخواست کو اس طرح ماڈیولاری کرتے ہیں تو ہم اپنے ٹیمپلیٹ یا جزو کو ویب سائٹ کے مختلف حصے میں دوبارہ استعمال کرسکتے ہیں اور یہ انگولر جے ایس ڈویلپمنٹ کمپنی کے ل very بہت مددگار ثابت ہوتا ہے کیونکہ اس میں بہت زیادہ وقت بچتا ہے اور ترقیاتی عمل کی رفتار تیز ہوتی ہے۔

رد .عمل

ری ایکٹ کے ساتھ تعمیر کردہ ایپلیکیشنز کے لئے کوئی "درست" ڈھانچہ موجود نہیں ہے یہ ایک بہت بڑی جاوا اسکرپٹ لائبریری ہے جو ہمیں صارف کے نظارے کو اپ ڈیٹ کرنے میں مدد کرتی ہے۔ لیکن پھر بھی رد عمل ہمیں خود ہی ایپلی کیشنز بنانے کی اجازت نہیں دیتا ہے۔ لائبریری میں ماڈل اور کنٹرولر پرت نہیں ہیں۔ اس خلا کو پُر کرنے کے لئے ، فیس بک نے فلکس کو متعارف کرایا ، جس میں آج کل متعدد شکلیں ہیں ، درخواست کے کام کے بہاؤ کو کنٹرول کرنے کے لئے۔

رد عمل اجزاء کے درختوں کی تعمیر کا ایک بہت آسان اور موثر طریقہ فراہم کرتا ہے۔ یہ ایک عملی پروگرامنگ اسٹائل کی حامل ہے جہاں جزو کی تعریفیں اعلانیہ ہوتی ہیں۔ ری ایکٹ اجزاء سے اپنی ایپ کمپوز کرنا افعال سے جاوا اسکرپٹ پروگرام مرتب کرنے کے مترادف ہے۔

ڈیٹا بائنڈنگ

ایم وی سی پیٹرنز میں کسی بھی ڈیٹا کو غیر سمت یا دو جہتی بہاؤ میں منتقل کرنے کے لئے پابند کرنا سب سے اہم موضوع ہے۔ ڈیٹا بائنڈنگ ڈیٹا کی ہم آہنگی کے عمل ہے جو ماڈل اور نظارے کے اجزاء کے مابین کام کرتے ہیں۔

AngularJS

کونیی ایپس میں ڈیٹا بائنڈنگ ماڈل اور دیکھنے والے اجزاء کے مابین ڈیٹا کا خودکار مطابقت پذیری ہے۔ انگولر جس طرح سے ڈیٹا بائنڈنگ کا نفاذ کرتا ہے اس سے آپ ماڈل کو اپنی درخواست میں واحد وسیلہ کا سچائی سمجھنے دیتے ہیں۔ یہ نظارہ ہر وقت ماڈل کی ایک پیش گوئی ہے۔ جب ماڈل تبدیل ہوتا ہے تو ، نظریہ تبدیلی کی عکاسی کرتا ہے اور اس کے برعکس۔
 ماڈل سے دیکھنے یا اس کے برعکس مطابقت پذیری کے طریقوں سے یہ اعداد و شمار کا جوڑنا ہے تاکہ جب بھی کسی بھی ماڈل یا نظارے میں کوئی تبدیلی واقع ہو ، دوسرے کو تبدیلی دکھانی چاہئے اور یہ مطابقت پذیری ہے۔

رد .عمل

ردعمل میں سب سے اچھی خصوصیت ورچوئل ڈوم ہے۔ رد عمل کے وقت اعداد و شمار کو اس کے دکھائے جانے والے خیالات میں انجکشن لگاتا ہے ، جب یہ ہو کہ جب روٹ ویو تیار ہوتا ہے یا کسی گھماؤ والے نظارے کے ذریعے ہوتا ہے ۔ریکٹ ایک طرفہ ڈیٹا بائنڈنگ کا استعمال کرتا ہے ، مطلب ہے کہ ہم اعداد و شمار کے بہاؤ کو صرف ایک ہی سمت میں منتقل کرنے کے اہل ہیں۔ کلاس کے اندر ، جو ڈیٹا گزر چکا ہے اس کو موجودہ سیاق و سباق کی پروپس پراپرٹی کے ذریعے حاصل کیا جاتا ہے۔

کارکردگی

AngularJS

جب ہم Angular کی کارکردگی کے بارے میں بات کرتے ہیں تو اس میں دو چیزوں کو دھیان میں رکھنا ہوتا ہے۔ جیسا کہ ہم نے پہلے ذکر کیا ہے ، کونییئر 1.x اور اس سے زیادہ دو طرفہ ڈیٹا بائنڈنگ پر انحصار کرتا ہے۔ یہ تصور "گندی جانچ پڑتال" پر مبنی ہے جو ایک ایسا طریقہ کار ہے جس سے ہماری انگولر جے ایس ایپلیکیشن ڈویلپمنٹ سست روی کا شکار ہوسکتی ہے۔

جب ہم HTML میں اقدار کو اپنے ماڈل کے ساتھ باندھتے ہیں تو ، AngularJS DOM میں ہونے والی تبدیلیوں کو ٹریک کرنے کے لئے ہر بائنڈنگ کے لئے ایک نگہبان تشکیل دیتا ہے۔ ایک بار ویو اپڈیٹس کے بعد ، AngularJS نئی قدر کا ابتدائی قدر کے ساتھ موازنہ کرتا ہے اور $ ڈائجسٹ لوپ چلاتا ہے۔ $ ڈائجسٹ لوپ پھر نہ صرف وہ قدر چیک کرتا ہے جو اصل میں تبدیل ہوچکی ہیں ، بلکہ دیگر تمام اقدار کو بھی دیکھتی ہیں جو دیکھنے والوں کے ذریعے معلوم کی جاتی ہیں۔ یہی وجہ ہے کہ اگر آپ کی درخواست میں بہت زیادہ دیکھنے والے ہیں تو کارکردگی میں بہت کمی واقع ہوگی۔

AngularJS فریم ورک کی ایک اور کمی DOM کے ساتھ کام کرنے کا طریقہ ہے۔ رد عمل کے برعکس ، AngularJS براؤزر میں حقیقی DOM میں تبدیلیوں کا اطلاق کرتا ہے۔ جب اصلی DOM اپ ڈیٹ ہوجاتا ہے تو ، نئے DOM کی نمائندگی کرنے کے لئے براؤزر کو بہت ساری داخلی اقدار کو تبدیل کرنا پڑتا ہے۔ اس کا اطلاق کی کارکردگی پر بھی منفی اثر پڑتا ہے۔
 ناقص کارکردگی بنیادی وجہ ہے جس کی وجہ سے Angular 2 کے حامیوں نے دوبارہ کام کیا کہ کس طرح Angular پروگرام کی حالت کو تبدیل کرتا ہے۔ کونیی 2 اور تازہ ترین کونیی 4 فریم ورک ورژن میں سرور سائیڈ رینڈرینگ اور ون وے ڈیٹا بطور رد عمل ظاہر ہوتا ہے۔ پھر بھی ، کونیی 2 اور 4 دو طرفہ ڈیٹا کو بطور اختیار کے طور پر پابند کرتے ہیں۔

رد .عمل

رد عمل نے ورچوئل ڈوم کا تصور پیش کیا ، جو AngularJS کے مقابلے میں رد عمل کا ایک سب سے بڑا فوائد ہے۔ ورچوئل DOM کیسے کام کرتا ہے؟ جب ہماری ایچ ٹی ایم ایل دستاویز بھری ہوئی ہے ، تو رد عمل جاوا اسکرپٹ اشیاء سے ہلکا پھلکا ڈوم ڈریٹ تیار کرتا ہے اور اسے سرور پر محفوظ کرتا ہے۔ جب صارف ، براؤزر میں فیلڈ میں نیا ڈیٹا داخل کرتا ہے تو ، رد عمل ایک نیا ورچوئل DOM تخلیق کرتا ہے اور پھر اس کا موازنہ سابقہ ​​محفوظ کردہ DOM سے کرتا ہے۔ لائبریری اس طرح دو آبجیکٹ ماڈلز کے مابین مماثلت پاتا ہے اور ایک بار پھر ورچوئل DOM کو دوبارہ تشکیل دیتا ہے ، لیکن نئے تبدیل شدہ HTML کے ساتھ۔ یہ تمام کام سرور پر کیا گیا ہے ، جس سے براؤزر پر بوجھ کم ہوتا ہے۔

اب ، براؤزر کو مکمل طور پر نیا HTML بھیجنے کے بجائے ، رد عمل HTML کو صرف تبدیل شدہ عنصر کے لئے بھیجتا ہے۔ یہ نقطہ نظر AngularJS کی پیش کش سے کہیں زیادہ کارآمد ہے۔

انحصار کو حل کرنا

AngularJS

انحصار انجکشن ایک سافٹ ویئر ڈیزائن کا نمونہ ہے جس میں اجزاء کو جزو کے اندر ہارڈکوڈ کرنے کے بجائے انحصار دیا جاتا ہے۔ یہ کسی جزو کو انحصار کا پتہ لگانے سے دور کرتا ہے اور انحصار کو قابل ترتیب بناتا ہے۔ اس سے اجزا کو دوبارہ قابل استعمال ، قابل برقرار اور قابل جانچ بنانے میں مدد ملتی ہے۔
 AngularJS خود بخود موزوں اشیاء کو ڈھونڈتا ہے جنہیں انجکشن لگائے جاتے ہیں $ روٹ پارام ، $ فلٹر ، اسٹور اور $ اسکوپ پیرامیٹرز کے طور پر۔ دو کام ہیں جو AngularJS فریم ورک میں انحصار انجیکشن کو ممکن بناتے ہیں: ject انجیکشن اور $ فراہم کرتے ہیں۔

رد .عمل

انحصار انجیکشن کے حوالے سے رد عمل اور AngularJS کے درمیان فرق یہ ہے کہ انحصار انجیکشن کے لئے بلٹ ان کنٹینر کا کوئی تصور پیش نہیں کرتا ہے۔ لیکن اس کا مطلب یہ نہیں ہے کہ ہمیں اپنے رد عمل کے منصوبے میں انحصار انجیکشن لانے کے طریقہ کار کے بارے میں سوچنا ہوگا۔ آپ رد عمل کی درخواست میں خود بخود انحصار انجیکشن کرنے کے ل several کئی آلات استعمال کرسکتے ہیں۔ اس طرح کے آلات میں براؤزرفی ، ریوئر جے جے ، ای سی ایم اے اسکرپٹ 6 ماڈیولز شامل ہیں جن کو ہم بابل ، ری ایکٹ جے ایس ڈی ، وغیرہ کے ذریعہ استعمال کرسکتے ہیں۔ واحد چیلنج ہے کہ استعمال کرنے کے ل a کسی آلے کا انتخاب کریں۔

ہدایت اور ٹیمپلیٹس

AngularJS

AngularJS میں ہدایات DOM کے گرد ہمارے کوڈ کو منظم کرنے کا ایک طریقہ ہے۔ اگر انگولر جے ایس کے ساتھ کام کر رہے ہیں تو ، ہم صرف ہدایت کے ذریعہ ڈوم تک رسائی حاصل کرتے ہیں۔ اینگولر جے ایس کے پاس بہت سی معیاری ہدایات ہیں ، جیسے این جی بائنڈ یا این جی - ایپ ، لیکن بعض اوقات ہم انگول جے ایس میں ٹیمپلیٹس میں ڈیٹا داخل کرنے کے ل our اپنی ہدایت خود کرتے ہیں۔ ٹیمپلیٹ میں لازمی عنصر ہونا چاہئے جس میں ہماری ہدایت نامی ایک صفت کے طور پر لکھا گیا ہو۔ یہ اتنا ہی آسان ہے۔ لیکن AngularJS ہدایت ، اگر مکمل طور پر بیان کی گئیں تو ، یہ نفیس ہیں۔ ترتیبات کے ساتھ آبجیکٹ ، جسے ہم ہدایت میں واپس کرتے ہیں ، تقریبا around دس خصوصیات پر مشتمل ہے۔ اس طرح کی خصوصیات جیسے ٹیمپلل یا ٹیمپلیٹ کو سمجھنا آسان ہے۔

رد .عمل

ردعمل سانچوں اور ہدایتوں یا ٹیمپلیٹ منطق میں تقسیم کی پیش کش نہیں کرتا ہے۔ ٹیمپلیٹ میں ہی ٹیمپلیٹ لاجک لکھنا چاہئے۔ یہ کیسا لگتا ہے اسے دیکھنے کے لئے ، گٹ ہب سے ایک مثال کھولیں۔ آپ دیکھیں گے کہ React's اتحادی ایپ۔ ٹوڈو آئٹم ایک معیاری React.createClass () طریقہ کے ساتھ تشکیل دیا گیا ہے۔ ہم اس فنکشن میں خصوصیات کے ساتھ کوئی شے منتقل کرتے ہیں۔ اجزاءی ڈیڈ اپ ڈیٹ ، کمپاؤنڈ اپ ڈیٹ ، ہینڈل کی ڈاون ، یا ہینڈل سبمٹ جیسے املاک منطق کی نمائندگی کرتی ہیں - ہمارے سانچے کے ساتھ کیا ہوگا۔ جزو کے اختتام پر ، ہم عام طور پر رینڈر پراپرٹی کی وضاحت کرتے ہیں ، جو براؤزر میں پیش کیا جانے والا ایک ٹیمپلیٹ ہے۔ ہر چیز ایک جگہ پر واقع ہے ، اور ٹیمپلیٹ میں جے ایس ایکس نحو سمجھنا آسان ہے یہاں تک کہ اگر آپ جے ایس ایکس میں لکھنا نہیں جانتے ہیں۔ یہ واضح ہے کہ ہمارے سانچے کے ساتھ کیا ہونے والا ہے ، اسے کیسے پیش کیا جانا چاہئے اور پراپرٹیز کے ذریعہ اس کے لئے کون سی معلومات پیش کی جائے گی۔

نتیجہ:

جب آپ مباحثے کے آخر تک پہنچتے ہیں ، اب آپ دونوں فریم ورک پر کچھ نکات واضح ہیں اور جو ویب ایپلیکیشن ڈویلپمنٹ کے ل better بہتر ہیں۔ لہذا ، اگر آپ ان میں سے کسی کو منتخب کرنے کا فیصلہ کررہے ہیں تو ، یہاں میری رائے ہے۔ اگر آپ ایک بنیادی ویب ایپ تیار کرنے کی کوشش کر رہے ہیں تو پھر دونوں کو استعمال کیا جاسکتا ہے۔ پھر بھی ، ReactJS SEO دوستانہ ، حقیقی وقت اور بھاری ٹریفک کے ساتھ مطابقت رکھتا ہے۔ جبکہ ، AngularJS وشوسنییتا کے ساتھ ہموار ترقی اور جانچ پیش کرتا ہے۔

اصل میں کونیی دماغوں میں شائع ہوا۔