JavaScript और CSS मिनिफ़ायर

यह क्या करता है

मिनिफ़िकेशन वह सब हटा देता है जिसकी ब्राउज़र को आपका कोड चलाने के लिए ज़रूरत नहीं होती: व्हाइटस्पेस, लाइन ब्रेक, कमेंट और लंबे नाम। छोटी फ़ाइलें तेज़ी से डाउनलोड होती हैं, जिससे पेज लोड टाइम और Core Web Vitals बेहतर होते हैं, ख़ासकर मोबाइल नेटवर्क पर।

यह टूल JavaScript को Terser से मिनिफ़ाई करता है, वही मिनिफ़ायर जो webpack, Rollup और Vite इस्तेमाल करते हैं, और CSS को CSSO से, जो स्टाइलशीट को रीस्ट्रक्चर भी करता है: यह रंगों को छोटा करता है (#ffffff से #fff), फ़ालतू इकाइयाँ और वैल्यू हटाता है (0px 0px से 0), और एक जैसे selectors या डिक्लेरेशन वाले नियमों को मर्ज करता है।

कैसे इस्तेमाल करें

1. कोड को इनपुट बॉक्स में पेस्ट करें, उस पर .js या .css फ़ाइल ड्रॉप करें, या उदाहरण पर क्लिक करें।
2. JavaScript या CSS चुनें।
3. JavaScript के लिए, वेरिएबल नाम छोटे करें लोकल वेरिएबल और पैरामीटर का नाम एक अक्षर कर देता है। एक्सपोर्ट किए गए और ग्लोबल नाम कभी नहीं बदले जाते।
4. CSS के लिए, डुप्लिकेट नियम मर्ज करें एक जैसे डिक्लेरेशन वाले नियमों को जोड़ देता है।
5. परिणाम कॉपी या डाउनलोड करें। हर बॉक्स के नीचे के साइज़ काउंटर दिखाते हैं कि आपने कितना बचाया।

अगर JavaScript में सिंटैक्स एरर है, तो एरर मैसेज लाइन और कॉलम दिखाता है ताकि आप वहाँ सीधे पहुँच सकें।

उदाहरण

// Sum the price of every item
export function cartTotal(items, discountPercent = 0) {
  const subtotal = items.reduce(function (sum, item) {
    return sum + item.price * item.quantity
  }, 0)
  return subtotal * (1 - discountPercent / 100)
}

बन जाता है

export function cartTotal(t,r=0){return t.reduce(function(t,r){return t+r.price*r.quantity},0)*(1-r/100)}

इसे कब इस्तेमाल करें

इसे किसी तेज़, एक बार के काम के लिए इस्तेमाल करें: CDN के लिए स्निपेट, HTML ईमेल में इनलाइन स्क्रिप्ट, bookmarklet, या यह देखने के लिए कि कोई लाइब्रेरी कितनी छोटी हो सकती है। असली प्रोजेक्ट में, आपके bundler को हर build पर मिनिफ़ाई करना चाहिए ताकि सोर्स पढ़ने लायक बना रहे।