अपनी CSS को छोटा करें
पेज के रेंडर होने से पहले CSS के हर बाइट को डाउनलोड और पार्स करना पड़ता है, इसलिए छोटी स्टाइलशीट का मतलब है तेज़ फर्स्ट पेंट, बेहतर कोर वेब वाइटल्स और कम मोबाइल डेटा की खपत। यह CSS minifier व्हाइटस्पेस और कमेंट्स को हटाता है और स्ट्रक्चरल ऑप्टिमाइज़ेशन लागू करता है — जैसे डुप्लिकेट रूल्स को मिलाना, कलर्स को छोटा करना, और अनावश्यक वैल्यूज़ को हटाना — ताकि पेज के लुक को बदले बिना आपकी स्टाइलशीट का साइज़ कम से कम हो सके।
फीचर्स
- व्हाइटस्पेस और कमेंट्स हटाना।
- वैल्यू को छोटा करना: कलर्स, ज़ीरो, यूनिट्स और फ़ॉन्ट वेट।
- स्ट्रक्चरल ऑप्टिमाइज़ेशन: डुप्लिकेट सिलेक्टर्स को मिलाता है और ओवरराइड की गई डिक्लेरेशन को हटाता है।
- लाइसेंस कमेंट्स (
/*! … */) अनुरोध पर सुरक्षित रखे जाते हैं। - साइज़ की तुलना बाइट्स और प्रतिशत में।
- प्राइवेट: पूरी तरह से आपके ब्राउज़र में चलता है।
पहले और बाद में
.card .title {
font-weight: bold;
color: #333333;
}
.card .title {
font-size: 1.25em;
}
यह बन जाता है
.card .title{font-weight:700;color:#333;font-size:1.25em}
Minify कब करें
प्रोडक्शन के लिए अपने बिल्ड के हिस्से के रूप में CSS को Minify करें, और वर्ज़न कंट्रोल में पढ़ने योग्य सोर्स कोड रखें। ज़्यादातर फ्रेमवर्क और बंडलर्स यह काम अपने आप करते हैं; यह टूल क्विक फिक्स, CMS थीम्स, ईमेल टेम्प्लेट्स, एम्बेडेड विजेट्स और बिना बिल्ड स्टेप वाले प्रोजेक्ट्स के लिए बहुत उपयोगी है।
संबंधित टूल्स
JavaScript Minifier के साथ स्क्रिप्ट्स को Minify करें, Box Shadow Generator और CSS Gradient Generator के साथ विज़ुअली स्टाइल्स बनाएँ, या JSON Formatter के साथ JSON को फ़ॉर्मेट करें।