HTML मिनिफ़ायर

ब्राउज़र में चलता है फ़ॉर्मेटिंग

HTML को सुरक्षित ढंग से छोटा करें: टैग के बीच व्हाइटस्पेस समेटें, कमेंट हटाएँ (conditional कमेंट छोड़कर), और चाहें तो वैकल्पिक कोट्स भी हटाएँ — साइज़ की बचत के साथ।

गोपनीयता: यह टूल पूरी तरह आपके ब्राउज़र में चलता है। आपका इनपुट कभी आपके डिवाइस से बाहर नहीं जाता।

फ़ॉर्मेटर या मिनिफ़ायर कोड में क्या बदलता है?

फ़ॉर्मेटर लेआउट बदलता है — व्हाइटस्पेस, लाइन ब्रेक और इंडेंटेशन — ताकि HTML, CSS या JavaScript एक जैसा पढ़ने में आए, और कुछ फ़ॉर्मेटर वे बारीकियाँ भी एक-सी कर देते हैं जिन्हें भाषा बराबर मानती है, जैसे HTML में टैग नाम का केस या एट्रिब्यूट के कोट; मिनिफ़ायर वह सब हटाता है जिसकी ब्राउज़र को ज़रूरत नहीं — कमेंट, व्हाइटस्पेस, वैकल्पिक सेमीकोलन — और वैल्यू को छोटे बराबर रूप में लिख सकता है, जैसे #ffffff की जगह #fff। दोनों का मक़सद कोड का व्यवहार बदलना नहीं है, फिर भी कमिट करने से पहले diff देखें: कोड का क्रम बदलने वाला विकल्प, जैसे CSS प्रॉपर्टी सॉर्ट करना, यह बदल सकता है कि कौन-सा declaration लागू हो, और छोटे अक्षरों में बदला गया टैग नाम <MyComponent> जैसे केस-संवेदी फ़्रेमवर्क कंपोनेंट को तोड़ देता है।

HTML मिनिफ़ायर कैसे इस्तेमाल करें

  1. HTML पेस्ट करें।
  2. मनचाहे विकल्प चालू करें (कोट्स हटाना डिफ़ॉल्ट रूप से बंद है)।
  3. कॉम्पैक्ट नतीजा कॉपी करें और साइज़ की बचत देखें।

HTML मिनिफ़ायर की खूबियाँ

  • टैग के बीच और टेक्स्ट के अंदर व्हाइटस्पेस समेटता है
  • कमेंट हटाता है, पर conditional (<!--[if IE]>) और <!--! कमेंट रखता है
  • जहाँ HTML5 अनुमति देता है वहाँ एट्रिब्यूट के कोट्स हटाने का विकल्प
  • inline <style> और <script> ब्लॉक को मिनिफ़ाई करता है
  • बेकार एट्रिब्यूट हटाता है (type="text/javascript", type="text/css", method="get")
  • <pre> और <textarea> के कंटेंट को कभी नहीं छूता

HTML मिनिफ़ायर का उदाहरण

एक स्निपेट को मिनिफ़ाई करना

इनपुट:

<div class="a">
  <p>Hello   <b>world</b></p>
  <!-- note -->
</div>

आउटपुट:

<div class="a"><p>Hello <b>world</b></p></div>

HTML मिनिफ़ायर के बारे में अक्सर पूछे जाने वाले सवाल

क्या <pre> और <textarea> के अंदर का व्हाइटस्पेस प्रभावित होता है?

नहीं। वे एलिमेंट अपना कंटेंट बिल्कुल वैसा ही रखते हैं; सिर्फ़ टैग के बीच और सामान्य टेक्स्ट के अंदर का व्हाइटस्पेस समेटा जाता है।

कौन-से कमेंट हटाए जाते हैं?

सामान्य <!-- comments --> हटा दिए जाते हैं। "Keep conditional comments" चालू होने पर conditional कमेंट (<!--[if IE]>) और <!--! से शुरू होने वाले कमेंट रखे जाते हैं।

क्या एट्रिब्यूट के कोट्स हटाना सुरक्षित है?

कोट्स सिर्फ़ तब हटते हैं जब वैल्यू में स्पेस, कोट्स, =, <, > या backtick न हो — यह वैध HTML5 है। अगर आपकी toolchain को कोट किए एट्रिब्यूट चाहिए तो यह विकल्प बंद रखें।

क्या यह inline CSS और JavaScript भी मिनिफ़ाई करता है?

हाँ। <style> का कंटेंट CSS मिनिफ़ायर से और <script> का कंटेंट (सिर्फ़ JavaScript टाइप) JavaScript मिनिफ़ायर से गुज़रता है।

संदर्भ

  • HTML Living StandardWHATWGHTML भाषा, नामित कैरेक्टर रेफ़रेंस (एंटिटी) और ब्राउज़रों के पार्सिंग नियमों सहित।
  • ECMAScript® Language Specification (ECMA-262)Ecma International / TC39JavaScript भाषा का मानक, जिसमें RegExp का व्याकरण और अर्थ, JSON.parse/JSON.stringify और Date ऑब्जेक्ट शामिल हैं।