मुफ़्त SVG ऑप्टिमाइज़र और मिनिफायर

यह कैसे काम करता है

यह टूल एक हाथ से लिखे ऑप्टिमाइज़र का उपयोग करके SVG फ़ाइल साइज़ घटाता है जो पूरी तरह आपके ब्राउज़र में चलता है — कोई लाइब्रेरी नहीं, कोई सर्वर नहीं। यह दो पास मिलाता है: attribute-स्तरीय सटीकता के काम के लिए ब्राउज़र के बिल्ट-इन DOMParser/XMLSerializer, और कमेंट हटाने, मेटाडेटा हटाने, और व्हाइटस्पेस समेटने के लिए लक्षित रेगेक्स प्रतिस्थापन।

1. 1
   DOMParser SVG को साफ़ करता है

   किसी भी ऑप्टिमाइज़ेशन से पहले, ब्राउज़र का DOMParser SVG को XML के रूप में पढ़ता है और हर एलिमेंट पर चलता है। स्क्रिप्ट टैग, इवेंट हैंडलर (कोई भी on* एट्रिब्यूट), एनिमेशन एलिमेंट, और बाहरी URL रेफ़रेंस बिना शर्त हटाए जाते हैं — यह चलता है चाहे आप कोई भी ऑप्टिमाइज़ेशन विकल्प चुनें।
2. 2
   DOM-आधारित दशमलव राउंडिंग

   अगर दशमलव राउंडिंग सक्षम है, ऑप्टिमाइज़र पार्स किए DOM पर दूसरी बार चलता है और केवल ज्ञात न्यूमेरिक एट्रिब्यूट (path d डेटा, कोऑर्डिनेट, transform वैल्यू, stroke चौड़ाई, आदि) पर राउंडिंग लागू करता है, एक रेगेक्स उपयोग करते हुए जो .5.5 जैसे जुड़े path वैल्यू को ख़राब किए बिना अकेली floating-point संख्याएँ मैच करता है।
3. 3
   रेगेक्स पास सीरियलाइज़्ड मार्कअप साफ़ करते हैं

   XMLSerializer नॉर्मलाइज़्ड XML बनाता है, फिर लक्षित स्ट्रिंग रिप्लेसमेंट HTML कमेंट, Inkscape/Sodipodi एडिटर मेटाडेटा, XML declaration, अनावश्यक डिफ़ॉल्ट एट्रिब्यूट (जैसे version="1.1"), और इंटर-टैग व्हाइटस्पेस हटाते हैं — हर पास सीमित दायरे में ताकि टेक्स्ट नोड कंटेंट को कभी न छुआ जाए।
4. 4
   Gzip साइज़ और एक्सपोर्ट फ़ॉर्मेट

   ब्राउज़र का CompressionStream API इनपुट और आउटपुट दोनों के असली gzip साइज़ गणना करता है, क्योंकि यही असल में वेब पर ट्रांसफ़र लागत तय करता है। ऑप्टिमाइज़्ड SVG डाउनलोड की जा सकती है, रॉ SVG के रूप में कॉपी की जा सकती है, React JSX-रेडी camelCase एट्रिब्यूट में कन्वर्ट की जा सकती है, या CSS data URI के रूप में एनकोड की जा सकती है — सभी कन्वर्ज़न स्थानीय रूप से होते हैं।

संबंधित टूल