HTML मिनिफ़ायर

नया

comments हटाकर और whitespace घटाकर HTML कंप्रेस करें।

Mode

Options

Drag & drop an .html file, or click to browse

—Original

—Minified

— Saved

—Gzipped

Input

Output

Runs entirely in your browser. Nothing is uploaded.

HTML को एक ही जगह minify और compress करें

यह HTML minifier वो सब कुछ हटा देता है जो browser को page render करने के लिए ज़रूरी नहीं होता — comments, फ़ालतू whitespace, और tags के बीच की line breaks व indentation — ताकि आपकी file physically छोटी हो जाए, लेकिन दिखे और काम बिल्कुल पहले जैसे ही करे। अपना markup paste करें या .html file drop करें, और compressed result तुरंत दिखेगा — exact bytes और percentage बचत के साथ।

यह एक HTML compressor और HTML beautifier दोनों का काम करता है: एक toggle से आप minifying और un-minifying के बीच switch कर सकते हैं, यानी जो tool आपके markup को compress करता है, वही एक minified page को वापस clean, indented code में भी बदल सकता है। सब कुछ आपके browser में चलता है — कोई upload नहीं, कोई account नहीं, कोई limit नहीं।

क्या हटाया जाता है — और क्या कभी नहीं छुआ जाता

जब आप HTML minify करते हैं, तो tool comments () हटाता है, whitespace के runs को collapse करता है, block-level tags के बीच की gaps को trim करता है, boolean attributes को collapse करता है (disabled="disabled" सिर्फ़ disabled बन जाता है) और optionally </li> और </td> जैसे redundant closing tags भी हटा सकता है। Conditional comments (<!--[if IE]>) हमेशा preserve किए जाते हैं।

सबसे ज़रूरी बात — यह safe है। <pre>, <textarea>, <script> और <style> के contents को कुछ भी strip होने से पहले protect किया जाता है, और inline elements — links, <span>s, <strong> — के बीच के single spaces बने रहते हैं, ताकि आपका text कभी एक साथ नहीं जुड़े। यही safety model kangax के HTMLMinifier में भी है — जो सबसे ज़्यादा इस्तेमाल होने वाली HTML minification library है, GitHub पर 5,000 से ज़्यादा stars के साथ। Quoted attribute values भी protect हैं, इसलिए title में double spaces जैसे लिखे थे वैसे ही रहते हैं।

Minify या beautify — सच में दोनों तरफ़ काम करने वाला tool

किसी page को पढ़ना है जो एक ही line में compress हो गया है? Beautify mode में switch करें और HTML unminify करें: tool markup को re-indent करता है, tags को अपनी-अपनी lines पर रखता है और structure को फिर से scan करना आसान बनाता है। 2-space, 4-space या tab indentation चुनें — जो आपके project के style से match करे।

चूँकि minifying और beautifying reversible हैं, आप minified production HTML paste कर सकते हैं, पढ़ सकते हैं, बदल सकते हैं, और फिर से minify कर सकते हैं — बिना page छोड़े या कुछ install किए। PrettyDiff और Prettier जैसे tools भी HTML formatting करते हैं, लेकिन उनके लिए Node.js या browser extension चाहिए। यह tool किसी भी browser में, किसी भी device पर — mobile सहित — बिना किसी setup के तुरंत काम करता है।

बचाए गए bytes देखें — gzip सहित

एक stats bar original size, output size, और bytes व percentage की बचत दिखाता है, ताकि आपको हमेशा पता रहे कि आपका HTML कितना छोटा हुआ। Sizes real UTF-8 bytes में मापी जाती हैं, न कि character counts में, इसलिए वो match करती हैं जो आपका server actually serve करता है।

यह browser में locally compute किया गया gzipped figure भी दिखाता है। Minification और gzip एक साथ काम करते हैं — source को minify करें, फिर host उसे compress करे — और दोनों numbers एक साथ देखने से combined फ़ायदा साफ़ हो जाता है। Google के PageSpeed Insights और web.dev दोनों steps करने की सलाह देते हैं। ज़्यादातर competing HTML minifiers सिर्फ़ minified byte count दिखाते हैं; यह tool gzip estimate भी दिखाता है — जो असल में यह तय करता है कि network पर आपका page कितनी तेज़ load होगा।

Inline CSS और JavaScript को safely minify करें

Real-world pages में styling और behaviour inline होते हैं। Minify inline CSS चालू करें और हर <style> block उसी तरह compress होगा जैसे एक dedicated CSS minifier करता है — comments और whitespace हटाए जाएंगे, strings, url() और calc() protect रहेंगे ताकि कुछ टूटे नहीं।

Minify inline JS <script> blocks को conservatively तरीके से तैयार करता है: comments strip करता है और indentation collapse करता है, लेकिन जानबूझकर line breaks रखता है, ताकि automatic semicolon insertion पर depend करने वाला JavaScript corrupt न हो। JSON, templates या दूसरे non-JavaScript types के रूप में marked scripts detect होकर untouched छोड़ दिए जाते हैं। यह combined approach अलग-अलग CSS Minifier और JS Minifier को एक-एक करके चलाने से बेहतर है, क्योंकि mixed HTML file पर apply होने पर हर एक context को गलत पढ़ सकता है।

HTMLMinifier.com, Minifier.org, और Willpeavy से यह कैसे अलग है

सबसे popular competing HTML minifiers — HTMLMinifier.com, Minifier.org, और Willpeavy.com का HTML minifier — सभी आपके HTML को server-side process करते हैं। आप जो भी snippet paste करते हैं वो network के ज़रिए एक third-party server को भेजा जाता है। Public test HTML के लिए यह ठीक है; लेकिन client work, unreleased pages, या किसी भी HTML में जिसमें auth tokens, private content, या form data हो — उसके लिए यह एक real privacy risk है। Minifycode.com की भी यही limitation है।

यह tool पूरी तरह आपके browser में चलता है। HTML minify करने वाला JavaScript page load होने पर एक बार download होता है, फिर locally run होता है — कोई server नहीं, कोई data transmit नहीं। WordPress sites के लिए, यह उस gap को cover करता है जो WP Rocket, LiteSpeed Cache और Autoptimize जैसे plugins नहीं पहुँचते: individual template snippets, custom blocks और HTML emails जो plugin की automatic minification को bypass करते हैं। इसे template change commit करने से पहले quick-check के रूप में इस्तेमाल करें, या उन projects के लिए primary minifier के रूप में जो build system नहीं use करते।

Frequently asked questions

HTML minification क्या होती है?

HTML minification हर उस character को हटाती है जो browser को page render करने के लिए ज़रूरी नहीं है — comments, line breaks, indentation और tags के बीच की whitespace — बिना page के दिखने या काम करने में कोई बदलाव किए। उदाहरण के लिए, '<ul>\n <li>One</li>\n <li>Two</li>\n</ul>' (लगभग 43 bytes) minify होकर '<ul><li>One</li><li>Two</li></ul>' (33 bytes) बन जाता है। Visitor को rendered list बिल्कुल वैसी ही दिखती है। यह बचत एक snippet में छोटी लगती है, लेकिन indentation और CMS-generated markup से भरे real HTML pages routinely raw bytes में 15–25% छोटे हो जाते हैं — server पर gzip compression के साथ और भी ज़्यादा।

HTML minify क्यों करें?

छोटे HTML का मतलब है download करने के लिए कम bytes और browser के लिए कम parsing — इससे page तेज़ load होता है — जो First Contentful Paint (FCP) और Core Web Vitals scores को improve करता है, खासकर mobile पर। Google का PageSpeed Insights unminified HTML को एक standard performance issue के रूप में flag करता है और अपनी recommendations में इसे शामिल करता है। यह सबसे ज़्यादा फ़ायदेमंद है hand-written या CMS-generated pages के लिए जो indentation और developer comments से भरे होते हैं। आप जो भी kilobyte काटते हैं, वो एक kilobyte है जो visitor को कभी fetch नहीं करना पड़ेगा — जो slow mobile connections पर सबसे ज़्यादा मायने रखता है जहाँ bandwidth limited होती है।

Minification के दौरान क्या हटाया जाता है?

Comments (), whitespace के runs, tags के बीच की indentation और line breaks, और block-level elements के बीच के gaps हटाए जाते हैं। Minifier boolean attributes भी collapse करता है (तो 'disabled="disabled"' सिर्फ़ 'disabled' बन जाता है) और optionally </li> और </td> जैसे redundant closing tags भी drop कर सकता है। Conditional comments (<!--[if IE]>) हमेशा preserve किए जाते हैं क्योंकि वो अभी भी old IE targeting के लिए मायने रखते हैं। <pre>, <textarea>, <script> और <style> के contents को कभी नहीं छुआ जाता — उन elements के अंदर whitespace significant है और उसे बदलने से page टूट जाता।

क्या HTML minify करना फ़ायदेमंद है?

हाँ, जब HTML पहले से किसी build step से नहीं गुज़रता। जो pages आप hand-write करते हैं, CMS से export करते हैं, या WordPress theme में assemble करते हैं, साथ ही HTML emails और inline <style>/<script> blocks — ये सब indentation और comments के साथ ship होते हैं जिन्हें minification मुफ़्त में strip कर देती है। अगर Vite या webpack जैसा bundler पहले से आपका output minify करता है, तो उन files को दूसरे pass की ज़रूरत नहीं — लेकिन real-world HTML का ज़्यादातर हिस्सा कभी bundler नहीं देखता। Jekyll और Hugo जैसे static site builders HTML minifiers को optional plugins के रूप में शामिल करते हैं, और WP Rocket, LiteSpeed Cache, और Autoptimize जैसे WordPress plugins यह हर page render के लिए automatically करते हैं।

Minified HTML कितना छोटा हो जाता है?

Raw text में, minifying आमतौर पर 10–25% बचाती है। एक 30 KB hand-written page अक्सर लगभग 24 KB तक पहुँच जाता है, और एक छोटा snippet जैसे '<ul>\n <li>One</li>\n <li>Two</li>\n</ul>' (43 bytes) 33 bytes तक सिकुड़ जाता है — लगभग 23% छोटा। एक बार जब आपका server result को gzip करे, तो combined reduction आमतौर पर 70–85% होती है। यह tool minified size और gzipped estimate दोनों एक साथ दिखाता है ताकि आप एक बार में दोनों numbers देख सकें। Gzip estimate आपके browser में locally calculate होता है — server पर नहीं — इसलिए आपको कुछ भी upload किए बिना real combined बचत मिलती है।

क्या HTML minify करने से page टूट जाता है?

नहीं, जब यह safely किया जाए — और यह tool इसी तरह काम करता है। यह <pre>, <textarea>, <script> या <style> के contents को कभी नहीं छूता, जहाँ whitespace significant है, और inline elements जैसे links और <span>s के बीच single spaces preserve करता है — इसलिए 'a <a href="/x">link</a> here' कभी भी 'a link here' बनकर एक साथ नहीं जुड़ता। कुछ quick online minifiers उस spacing को collapse कर देते हैं और rendering या layout को subtly बदल देते हैं। Kangax का HTMLMinifier (सबसे popular Node.js HTML minification library) इसी वजह से similar safe-by-default approach use करता है। Minify करने के बाद अगर rendering में कोई फ़र्क दिखे, तो original structure restore करने के लिए Beautify mode use करें।

HTML unminify या beautify कैसे करें?

ऊपर के toggle से Beautify mode में switch करें और अपना minified HTML paste करें। Tool markup को re-indent करता है और tags को अपनी-अपनी lines पर रखता है, '<ul><li>One</li><li>Two</li></ul>' को वापस readable, formatted code में बदलता है। अपने project के style से match करने के लिए 2-space, 4-space या tab indentation चुनें। यह minifying का उलटा है — useful है production में मिले किसी minified page को inspect करने के लिए, किसी CMS template को पढ़ने के लिए जो build tool ने squash कर दी हो, या पूरी tag structure clearly layout देखकर layout debug करने के लिए।

Minification और gzip/compression में क्या फ़र्क है?

Minification source text को खुद छोटा करती है — आप physically छोटी .html file ship करते हैं। Gzip और Brotli transfer के दौरान bytes compress करते हैं, और browser transparently उन्हें arrive होते ही decompress करता है। दोनों stack करते हैं: पहले source minify करें, फिर server उसे gzip करे। Google के web.dev दोनों steps करने की recommend करते हैं — minifying उन bytes को eliminate करती है जिन्हें gzip पूरी तरह compress नहीं कर सकता, जबकि gzip उन repetitive patterns को handle करता है जो minification intact छोड़ती है। इसीलिए यह tool minified byte count और gzipped estimate दोनों दिखाता है, ताकि आप deploy करने से पहले और बाद में full combined gain देख सकें।

Minification और obfuscation में क्या फ़र्क है?

Minification HTML को smaller बनाती है जबकि इसे valid और beautify होने के बाद पूरी तरह readable रखती है — यह केवल वो characters delete करती है जिन्हें browser ignore करता है। Obfuscation जानबूझकर code को scramble या rewrite करती है ताकि इसे समझना या copy करना मुश्किल हो। HTML minify करने से आपके classes, IDs या content का नाम कभी नहीं बदलता और न ही meaning बदलती; यह lossless और reversible है — जो obfuscation नहीं है। अगर आप लोगों को अपना HTML source पढ़ने से रोकना चाहते हैं (जिसे browsers वैसे भी View Source के ज़रिए expose करते हैं), तो अकेला minification काम नहीं करेगा — आपको ऐसी additional techniques की ज़रूरत होगी जो minifier के scope से बाहर हैं।

क्या inline CSS और JavaScript को भी minify किया जा सकता है?

हाँ, एक ही pass में। 'Minify inline CSS' on रखें और tool हर <style> block के contents को compress करेगा — comments और whitespace strip होंगे जबकि strings, url() और calc() protect रहेंगे। 'Minify inline JS' <script> blocks को conservatively तैयार करता है: comments हटाता है और whitespace collapse करता है लेकिन line breaks preserve करता है ताकि automatic semicolon insertion (ASI) पर dependent code break न हो। JSON या templates के रूप में marked scripts untouched छोड़ दिए जाते हैं। यह combined approach उस gap को cover करती है जो CSS-only minifiers और JS-only minifiers दोनों miss करते हैं — HTML pages जिनमें तीनों languages एक साथ mixed हों।

क्या HTML online minify करना safe है?

इस tool के साथ, हाँ — क्योंकि यह JavaScript का use करके 100% आपके browser में run होता है। आपका HTML कभी upload, log या कहीं store नहीं होता, इसलिए unreleased pages, client work या private data वाला markup पूरी तरह आपके device पर रहता है। आप network disconnect करके confirm कर सकते हैं: minifier offline भी काम करता है क्योंकि कोई server involve नहीं है। इसके विपरीत, HTMLMinifier.com और Minifier.org दोनों आपका HTML processing के लिए remote server को भेजते हैं। Willpeavy.com का HTML minifier भी server round-trip करता है। Confidential projects के लिए, browser-local processing ही एकमात्र safe option है।

WordPress में HTML कैसे minify करें?

आपके पास दो options हैं। One-off के लिए, अपना rendered page source (या किसी template का output) copy करें और यहाँ paste करके minify करें। हर page के लिए automatically, एक caching या optimisation plugin HTML को on the fly minify कर सकता है: WP Rocket, W3 Total Cache, LiteSpeed Cache, और Autoptimize सभी में HTML minification settings हैं। WP Rocket और LiteSpeed Cache lots of dynamic content वाले complex themes के लिए सबसे reliable हैं। यह tool theme snippets, custom blocks और HTML email templates के लिए perfect है जिन्हें वो plugins automatically cover नहीं करते, जैसे Elementor custom sections या ACF field templates।

यह tool HTMLMinifier.com या Minifier.org से कैसे compare करता है?

HTMLMinifier.com और Minifier.org popular online HTML minifiers हैं, लेकिन दोनों आपका HTML processing के लिए remote server को भेजते हैं। इसका मतलब है आपका markup — unreleased pages, forms में passwords, या private client work सहित — आपके device को छोड़ देता है। Minifycode.com एक और server-side tool है जिसमें यही limitation है। यह tool browser में सब कुछ locally करता है, इसलिए कुछ भी कभी upload नहीं होता। Feature-wise, यह same interface में two-way beautifier, real-time gzip estimates, और inline CSS/JS minification add करता है — बिना page reloads या server round-trips के।

क्या यह HTML minifier iPhone और Android पर काम करता है?

हाँ, यह mobile पर पूरी तरह काम करता है — clipboard से HTML paste करें, minified result तुरंत देखें, और इसे वापस copy करें। Interface छोटी screens के अनुसार adapt होता है। इसे Safari for iOS और Chrome for Android पर test किया गया है। एक common mobile use case है किसी change को commit करने से पहले यह check करना कि page template कितना छोटा होगा — आप mobile browser के View Source से HTML paste कर सकते हैं और वहीं savings देख सकते हैं। कोई app download नहीं, कोई sign-up नहीं, और mobile पर कोई usage limits नहीं। यह page load होने के बाद network connection के बिना भी काम करता है।

सरल भाषा में अर्थ के साथ HTTP स्टेटस कोड का खोजने योग्य संदर्भ।

डेवलपर