अपनी JavaScript का साइज़ कम करें
JavaScript अक्सर वेब पेज का सबसे भारी हिस्सा होता है। पेज के इंटरैक्टिव होने से पहले इसके हर किलोबाइट को डाउनलोड, पार्स और एक्ज़ीक्यूट करना पड़ता है। इसे मिनिफाई (Minify) करने से इसका साइज़ आधा या उससे भी कम हो सकता है। यह टूल Terser का उपयोग करता है (जो ज़्यादातर आधुनिक बिल्ड टूल्स का मुख्य मिनिफायर है), ताकि सीधे आपके ब्राउज़र में व्हाइटस्पेस और कमेंट्स को हटाया जा सके, नामों को छोटा किया जा सके और सुरक्षित कोड कम्प्रेशन लागू किया जा सके।
विशेषताएँ
- आधुनिक ES2015+ सपोर्ट के साथ Terser इंजन।
- कम्प्रेशन: डेड-कोड हटाना, कॉन्स्टेंट फोल्डिंग और छोटा सिंटैक्स।
- लोकल वेरिएबल्स के लिए नेम मैंगलिंग (वैकल्पिक)।
- अनुरोध करने पर लाइसेंस कमेंट्स सुरक्षित रखे जाते हैं।
- बाइट्स और प्रतिशत में साइज़ की तुलना।
- प्राइवेट: कोड आपके डिवाइस पर ही (लोकली) प्रोसेस होता है।
साइज़ में होने वाली बचत
| कोड | साइज़ में कमी |
|---|---|
| अच्छी तरह से कमेंट किया गया एप्लिकेशन कोड | 50–70% |
| लाइब्रेरी सोर्स | 40–60% |
| पहले से कॉम्पैक्ट कोड | 15–30% |
| पहले से मिनिफाई किया गया कोड | 0–5% |
मिनिफाई की गई फ़ाइलों को gzip या Brotli कम्प्रेशन के साथ सर्व करने से आम तौर पर ट्रांसफ़र साइज़ 60–75% तक और कम हो जाता है।
टिप्स
- ओरिजिनल सोर्स सुरक्षित रखें — मिनिफाई किए गए कोड को पढ़ना और डीबग करना मुश्किल होता है। प्रोडक्शन कोड को डीबग करने के लिए अपने बिल्ड में सोर्स मैप्स का उपयोग करें।
- प्रोडक्शन के लिए बिल्ड स्टेप के रूप में मिनिफाई करें; यह टूल वन-ऑफ़ स्क्रिप्ट, स्निपेट्स, बुकमार्कलेट्स और बिना बंडलर वाले प्रोजेक्ट्स के लिए बेहतरीन है।
- मिनिफाई करने के बाद टेस्ट करें, विशेष रूप से वह कोड जो फ़ंक्शन के नामों या
evalपर निर्भर करता है।
संबंधित टूल्स
CSS Minifier से स्टाइलशीट्स को मिनिफाई करें, JSON Formatter से डेटा को प्रीटी-प्रिंट करें, या एम्बेड करने के लिए Base64 से स्क्रिप्ट्स को एनकोड करें।