Vite کو آسان بنانا
پرانے ٹولز جیسے Webpack یا CRA آپ کے پورے پروجیکٹ کو پہلے بنڈل (bundle) کر کے کام کرتے ہیں۔ وہ ہر فائل کو پڑھتے ہیں اور انہیں ایک بڑی JavaScript فائل میں یکجا کر دیتے ہیں۔ یہ چھوٹے پروجیکٹس کے لیے تو ٹھیک ہے، لیکن ہزاروں ماڈیولز والے بڑے پروجیکٹس کے لیے ناکام ہو جاتا ہے۔ بڑے بنڈلز کو بنانے میں سیکنڈ یا منٹ لگتے ہیں۔ جب بھی آپ کوئی فائل سیو کرتے ہیں، تو ٹول بنڈل کے بڑے حصوں کو دوبارہ بناتا ہے۔
Vite مختلف طریقے سے کام کرتا ہے۔ جدید براؤزرز ES modules کو natively سپورٹ کرتے ہیں۔ Vite ڈویلپمنٹ کے دوران آپ کے کوڈ کو بنڈل نہیں کرتا۔ یہ ہر فائل کو ایک الگ ماڈیول کے طور پر صرف اس وقت فراہم کرتا ہے جب براؤزر اسے طلب کرتا ہے۔
ایک بفے (buffet) ریسٹورنٹ کے بارے میں سوچیں۔ شیف دروازے کھلنے سے پہلے ہر ایک ڈش تیار کر لیتا ہے۔ اگر آپ ایک چھوٹا سا بدلاؤ چاہتے ہیں، تو شیف کو زیادہ تر بفے دوبارہ بنانا پڑتا ہے۔ آپ کو اپنے کھانے کے لیے کافی دیر انتظار کرنا پڑتا ہے۔ Webpack اسی طرح کام کرتا ہے۔
اب ایک à la carte ریسٹورنٹ کے بارے میں سوچیں۔ دروازے فوراً کھل جاتے ہیں۔ آپ ایک ڈش آرڈر کرتے ہیں۔ شیف صرف وہی ڈش تیار کرتا ہے۔ اگر آپ بعد میں میٹھا (dessert) چاہتے ہیں، تو شیف صرف میٹھا تیار کرتا ہے۔ آپ کو پورا مینو پکنے کا انتظار نہیں کرنا پڑتا۔ Vite اسی طرح کام کرتا ہے۔
Vite دو مختلف ضروریات کے لیے دو مختلف حکمت عملیوں کا استعمال کرتا ہے:
Development (vite dev)
- حکمت عملی: بنڈلنگ کے بغیر native ESM modules فراہم کرتا ہے۔
- رفتار: فوری۔ یہ پروجیکٹ کے سائز پر منحصر نہیں ہے۔
- وجہ: لوکل نیٹ ورک ریکویسٹس تیز ہوتی ہیں۔
Production (vite build)
- حکمت عملی: Rolldown کا استعمال کرتے ہوئے سب کچھ بنڈل کرتا ہے۔
- رفتار: پروجیکٹ کے سائز پر منحصر ہے۔
- وجہ: سینکڑوں الگ الگ فائلیں اصل صارفین کے لیے بہت زیادہ HTTP ریکویسٹس پیدا کرتی ہیں۔ بنڈلنگ سے حتمی سائٹ ان کے لیے تیز ہو جاتی ہے۔
Vite آپ کو کوڈنگ کے دوران رفتار اور لانچ کے وقت بہترین کارکردگی (performance) فراہم کرتا ہے۔
ماخذ: https://dev.to/yuripeixinho/descomplicando-o-vite-1p62