मॉडर्न वेब ऐप्लिकेशन के लिए बंडल बनाना
मॉडर्न वेब ऐप्लिकेशन, फ़ाइलों (स्क्रिप्ट, स्टाइलशीट वगैरह) का प्रोडक्शन "बंडल" बनाने के लिए, अक्सर बंडलिंग टूल का इस्तेमाल करते हैं. यह ऑप्टिमाइज़ और कम से कम किया गया होता है और इसे उपयोगकर्ता कम समय में डाउनलोड कर सकते हैं. वेबपैक के साथ वेब परफ़ॉर्मेंस ऑप्टिमाइज़ेशन में, हम आपको वेबपैक का इस्तेमाल करके, साइट के संसाधनों को असरदार ढंग से ऑप्टिमाइज़ करने का तरीका बताएंगे. इससे लोगों को आपकी साइटों को ज़्यादा तेज़ी लोड करने और उनसे इंटरैक्ट करने में मदद मिल सकती है.
![Webpack का लोगो.](https://web.dev/static/articles/webpack/image/webpack-logo.png?authuser=6&hl=hi)
webpack आज इस्तेमाल किए जा रहे सबसे लोकप्रिय बंडलिंग टूल में से एक है. मॉडर्न कोड को ऑप्टिमाइज़ करने के लिए उपलब्ध सुविधाओं का फ़ायदा उठाकर, कोड को अलग-अलग करके इस्तेमाल करना और स्क्रिप्ट को अहम और ग़ैर-ज़रूरी हिस्सों में बांटना और इस्तेमाल न किए गए कोड (नाम के अलावा कुछ ऑप्टिमाइज़ेशन) को हटाना, यह पक्का कर सकता है कि आपके ऐप्लिकेशन में नेटवर्क और प्रोसेस करने में कम से कम खर्च होना चाहिए.
![JavaScript ऑप्टिमाइज़ेशन लागू करने से पहले और बाद में. टाइम-टू-इंटरैक्टिव मोड बेहतर हो गया है](https://web.dev/static/articles/webpack/image/before-after-applying-ja-4050ad9acad04.png?authuser=6&hl=hi)
सूज़ी लू की बंडल Buddy में कोड-अलग-अलग करने की सुविधा से प्रेरित
आइए, एक मॉडर्न ऐप्लिकेशन – JavaScript के सबसे महंगे संसाधनों में से एक को ऑप्टिमाइज़ करने से शुरुआत करते हैं.