मिनिफ़ाई / ब्यूटिफ़ाई

कोड मिनिफ़ाई या ब्यूटिफ़ाई करें। सब कुछ आपके ब्राउज़र में रहता है।

मिनिफ़ाई / ब्यूटिफ़ाई कैसे काम करता है

Minify / Beautify, HTML, CSS और JavaScript को संपीड़ित करता है, जिसमें comments, अनावश्यक whitespace और redundant characters हटाए जाते हैं, या minified code को पढ़ने योग्य indented रूप में वापस फैलाता है। सभी processing bundled parsers का उपयोग करके ब्राउज़र में होती है; आपका पेस्ट किया कुछ भी कहीं प्रेषित नहीं होता। यहां आपका टाइप किया कुछ भी आपके डिवाइस से नहीं जाता।

Minification सीधे page load performance को प्रभावित करती है: छोटी files तेज़ transfer होती हैं, तेज़ parse होती हैं और कम bandwidth उपभोग करती हैं। Production deployments के लिए minified assets standard हैं। यह टूल तब उपयोगी है जब आपको minified file पढ़नी हो (beautify), जब build pipeline में शामिल करने से पहले जांचना हो कि minifier किसी snippet के साथ क्या करता है, या जब build टूल set up किए बिना quick one-off minification चाहिए।

लिखा है Bastien Sulyan

मिनिफ़ाई / ब्यूटिफ़ाई: चरण दर चरण उपयोग विधि

अपना HTML, CSS या JavaScript code input area में पेस्ट करें।
Dropdown से language type चुनें (HTML, CSS या JavaScript)।
संपीड़ित version पाने के लिए 'Minify' पर क्लिक करें, या code को फैलाने और इंडेंट करने के लिए 'Beautify'।
Copy बटन का उपयोग करके output area से परिणाम कॉपी करें।
आवश्यकतानुसार अलग code पेस्ट करें और दोहराएं।

सामान्य उपयोग के मामले

एक frontend developer above-the-fold performance के लिए HTML head में इनलाइन करने के लिए critical CSS snippet को मिनिफ़ाई करना चाहता है।
एक developer को minified third-party script मिलती है और security review के दौरान उसका logic समझने के लिए उसे ब्यूटीफाई करना है।
एक technical writer documentation में शामिल करने के लिए minified JSON-LD script tag का prettified संस्करण चाहता है।
एक web developer build step जोड़ने का निर्णय लेने से पहले CSS file को मिनिफ़ाई करने से होने वाली byte savings जांचता है।

अक्सर पूछे जाने वाले प्रश्न

क्या मेरा पेस्ट किया code minification के लिए किसी सर्वर को भेजा जाता है?

नहीं। Minification और beautification पेज के अपने ही कोड से होती हैं, जो इसी टूल के लिए लिखा गया है, किसी third-party minifier से नहीं लिया गया। सारी processing ब्राउज़र टैब में ही रहती है। यहां आपके द्वारा पेस्ट किया गया कुछ भी Sunasty या किसी तीसरे पक्ष को नहीं भेजा जाता।

क्या JavaScript minification code के मूल व्यवहार को बनाए रखती है?

एक अच्छा minifier केवल whitespace हटाकर, controlled scope में variable names छोटे करके और comments निकालकर व्यवहार बनाए रखता है। यह टूल सुरक्षित transformations को लक्ष्य बनाता है। Dead-code elimination या function inlining जैसे aggressive optimizations आमतौर पर नहीं लागू होते, क्योंकि उनके लिए full program analysis चाहिए।

क्या मैं मिनिफ़ाई करके फिर result सत्यापित करने के लिए ब्यूटीफाई कर सकता हूं?

हाँ। पहले code मिनिफ़ाई करें, फिर minified output को वापस input में पेस्ट करें और Beautify पर क्लिक करें। Beautified version मूल source से अलग दिखेगा (variable names छोटे हो सकते हैं, comments हटे हुए) लेकिन संरचनात्मक रूप से बराबर होगा।

क्या HTML minification सभी comments हटाती है?

टूल minification के दौरान standard HTML comments () हटा देता है। पुराने IE versions द्वारा उपयोग किए जाने वाले conditional comments () हमेशा बनाए रखे जाते हैं, इसलिए comments हटाने से उन पर निर्भर legacy व्यवहार नहीं टूट सकता।

क्या मिनिफ़ाई किए जाने वाले code की कोई size limit है?

सीमा आपके browser tab की उपलब्ध memory है। कुछ सौ kilobytes तक का code जल्दी process होता है। बड़े JavaScript bundles (megabytes) के लिए esbuild, Terser या Lightning CSS जैसा dedicated build टूल production use के लिए तेज़ और अधिक उपयुक्त है।