இலவச மாற்றி

HTML மினிஃபையர்

உங்கள் உலாவியில் உடனடியாக HTML குறியீட்டைக் குறைத்து சுருக்கவும். கருத்துகளை அகற்றவும், இடைவெளியை சுருக்கவும் மற்றும் கோப்பு அளவைக் குறைக்கவும். இலவசம் மற்றும் தனிப்பட்டது.

ஒரு HTML கோப்பை இங்கே இழுத்து விடுங்கள்

.html மற்றும் .htm கோப்புகளை ஆதரிக்கிறது. அல்லது உங்கள் HTML ஐ மேலே ஒட்டவும்.

அல்லது

இந்த கருவி பற்றி

HTML minification ஆனது வலைப்பக்கத்தின் மூலத்திலிருந்து தேவையற்ற எழுத்துக்களை நீக்குகிறது — குறிச்சொற்கள், கருத்துகள், தேவையற்ற மேற்கோள்கள், விருப்பமான மூடும் குறிச்சொற்கள் ஆகியவற்றுக்கு இடையே உள்ள இடைவெளி — பக்கம் எவ்வாறு வழங்கப்பட வேண்டும் என்பதை மாற்றாமல் கோப்பு அளவைக் குறைக்கிறது. சேமிப்புகள் ஒரு பக்கத்திற்கு மிதமானவை (பொதுவாக 10-30%) ஆனால் பல கோரிக்கைகள் முழுவதும், குறிப்பாக நிலையான தளங்கள் அல்லது டைனமிக் சுருக்கம் இல்லாமல் வழங்கப்படும் பக்கங்களுக்கு.

இந்த மினிஃபையர் பிளாக்-லெவல் உறுப்புகளுக்கு இடையே உள்ள இடைவெளியை நீக்குகிறது, முக்கியமில்லாத உரையின் உள்ளே உள்ள இடைவெளியை சரிசெய்கிறது, HTML கருத்துகளை (IE நிபந்தனை கருத்துகள் தவிர), HTML5 விவரக்குறிப்பால் அனுமதிக்கப்படும் தேவையற்ற பண்புக்கூறு மேற்கோள்களை நீக்குகிறது, மேலும் விருப்பமான மூடுதல் குறிச்சொற்களை நீக்குகிறது (</p>, </lipec>). முடிவுகள் ஒவ்வொரு உலாவியிலும் உள்ள மூலத்திற்கு ஒரே மாதிரியாக வழங்கப்படுகின்றன.

சேவையக மட்டத்தில் ஜிஜிப் அல்லது ப்ரோட்லி சுருக்கத்துடன் இணைக்கப்படும்போது மினிஃபிகேஷன் மிகவும் பயனுள்ளதாக இருக்கும். சுருக்கமானது ஏற்கனவே சேமிக்கும் சிறுபான்மை உற்பத்தியில் பெரும்பகுதியை நீக்குகிறது, ஆனால் இரண்டும் இணைந்து இன்னும் சுருக்கத்தை மட்டுமே வெல்லும் - குறிப்பாக அலைவரிசை செலவுகள் முக்கியமான அதிக போக்குவரத்து தளங்களுக்கு.

HTML ஐ ஏன் குறைக்க வேண்டும்

சிறிய HTML வேகமாக ஏற்றப்படும், குறிப்பாக மெதுவான இணைப்புகள் மற்றும் மொபைல் நெட்வொர்க்குகளில். பக்க எடையானது கோர் வெப் வைட்டல்களை நேரடியாகப் பாதிக்கிறது - மிகப்பெரிய கன்டன்ஃபுல் பெயிண்ட் மற்றும் முதல் பைட்டுக்கான நேரம் ஆகிய இரண்டும் சர்வர் குறைவான HTML ஐ பாகுபடுத்தும் போது மேம்படும். எஸ்சிஓ தரவரிசை கோர் வெப் வைட்டல்ஸ் ஸ்கோரைச் சார்ந்து இருக்கும் தளங்களுக்கு, சிறுமைப்படுத்துதல் என்பது அளவிடக்கூடிய முன்னேற்றமாகும்.

சிறிய HTML ஆனது அலைவரிசை செலவுகளை அளவில் குறைக்கிறது. ஒரு பக்கத்திற்கு 10 KB சேமிப்புடன் ஒரு நாளைக்கு ஒரு மில்லியன் பக்கங்களுக்கு சேவை செய்யும் தளம் தினசரி 10 GB எக்ரேஸைச் சேமிக்கிறது. தரவு பரிமாற்றத்தின் மூலம் பில் செய்யும் CDNகளில் இருந்து வழங்கப்படும் நிலையான தளங்களுக்கான தாக்க கலவைகள்.

பயன்படுத்துவது எப்படி

HTML ஐ ஒட்டவும், சிறிய பதிப்பைப் பெறவும்.

  1. HTML உள்ளீட்டைச் சேர்க்கவும்: உள்ளீட்டு பகுதியில் HTML மூலத்தை ஒட்டவும் அல்லது .html கோப்பை கைவிடவும். எந்த செல்லுபடியாகும் HTML5 மார்க்அப்பையும் மினிஃபையர் ஏற்றுக்கொள்கிறது.
  2. விருப்பங்களை தேர்வு செய்யவும்: இயல்புநிலை கருத்துகளை அகற்றி, இடைவெளியை சுருக்கவும்; நீங்கள் குறிப்பிட்ட கூறுகளை பாதுகாக்க வேண்டும் என்றால் தனிப்பட்ட மாற்றங்களை முடக்கலாம் (எ.கா., ஆவணப்படுத்தலுக்கான கருத்துகளை வைத்திருங்கள்).
  3. சிறிதாக்கு: மினிஃபையர் HTML டோக்கன் ஸ்ட்ரீமில் நடந்து, செயல்படுத்தப்பட்ட ஒவ்வொரு மாற்றத்தையும் பயன்படுத்துகிறது. வெளியீடு குறைந்த அளவுடன் செயல்பாட்டு ரீதியாக ஒரே மாதிரியான HTML ஆகும்.
  4. நகலெடுக்கவும் அல்லது பதிவிறக்கவும்: வழங்கப்பட்ட HTML ஆக முடிவைப் பயன்படுத்தவும். வரிசைப்படுத்துவதற்கு முன், இலக்கு உலாவிகளில் பக்கத்தை சரியாக வழங்குவதை உறுதிப்படுத்தவும்.

பொதுவான பயன்பாட்டு வழக்குகள்

தொழில்நுட்ப விவரங்கள்

மினிஃபையர் டோக்கன் மூலம் HTML டோக்கனை செயலாக்குகிறது. பிளாக்-லெவல் உறுப்புகளுக்கு (<div>, <p>, <ul>) இடையே உள்ள இடைவெளி நீக்கப்பட்டது, ஏனெனில் இது ரெண்டரிங் பாதிக்காது. இன்லைன் சூழல்களில் உள்ள இடைவெளி (<span>, <a>, உரை உள்ளடக்கம்) பாதுகாக்கப்படுகிறது, ஏனெனில் இது ரெண்டரிங் பாதிக்கலாம்.

கருத்துகள் இயல்பாகவே அகற்றப்படும் ஆனால் நிபந்தனைக்குட்பட்ட கருத்துகள் (<!--[IE]>) பாதுகாக்கப்படும். HTML5 பாகுபடுத்தி அனுமதிக்கும் இடத்தில் பண்புக்கூறு மேற்கோள்கள் அகற்றப்படும் - இடைவெளிகள் அல்லது சிறப்பு எழுத்துக்கள் இல்லாத ஒற்றை வார்த்தை பண்புக்கூறு மதிப்புகள் மேற்கோள்களைத் தவிர்க்கலாம்.

HTML5 விவரக்குறிப்பின்படி விருப்ப நிறைவு குறிச்சொற்கள் நீக்கப்படும்: </p>, </li>, </td>, மேலும் சிலவற்றை ஒரு உடன்பிறந்தவர் பின்தொடரும் போது தவிர்க்கப்படலாம். இது வாசிப்பதற்கு வழக்கத்திற்கு மாறானது, ஆனால் உலாவிகள் ஒரே மாதிரியாகப் பாகுபடுத்தும் சரியான HTML5 ஆகும்.

சிறந்த நடைமுறைகள்

அடிக்கடி கேட்கப்படும் கேள்விகள்

HTML minification எதை நீக்குகிறது?
குறிச்சொற்கள், HTML கருத்துகள் (<!-- -->), விருப்ப மூடும் குறிச்சொற்கள் (</li>, </p>, </td>), இயல்புநிலை பண்புக்கூறு மதிப்புகள் (உள்ளீடுகளில் வகை="உரை") மற்றும் பூலியன் பண்புக்கூறு மதிப்புகள் (disabled="disabled" →) இடையே தேவையற்ற இடைவெளி.
மைனிஃபிகேஷன் எனது பக்கத்தை உடைக்க முடியுமா?
அரிதாக, ஆனால் உங்கள் CSS இன்லைன் கூறுகளுக்கு இடையே உள்ள இடைவெளியை நம்பியிருந்தால் அல்லது JavaScript இன்னர்HTML ஒப்பீடுகளைப் பயன்படுத்தினால் சாத்தியமாகும். சிறிய வெளியீட்டை எப்போதும் சோதிக்கவும். கருவி இயல்பாகவே பழமைவாத அமைப்புகளைப் பயன்படுத்துகிறது.
Next.js போன்ற கட்டமைப்பை நான் பயன்படுத்தினால் HTML ஐ சிறிதாக்க வேண்டுமா?
பெரும்பாலான நவீன கட்டமைப்புகள் (Next.js, Nuxt, Angular) உற்பத்தி உருவாக்கங்களில் தானாகவே HTML ஐக் குறைக்கின்றன. இந்த கருவி நிலையான HTML கோப்புகள், மின்னஞ்சல் டெம்ப்ளேட்கள் மற்றும் உருவாக்க அமைப்பு இல்லாத திட்டங்களுக்கு பயனுள்ளதாக இருக்கும்.
இது இன்லைன் CSS மற்றும் JavaScript ஐயும் குறைக்குமா?
இந்த கருவி HTML கட்டமைப்பில் கவனம் செலுத்துகிறது. இன்லைன் <style> மற்றும் <script> உள்ளடக்கங்கள் அப்படியே பாதுகாக்கப்படுகின்றன. அவர்களுக்கு, உகந்த முடிவுகளுக்கு பிரத்யேக CSS மற்றும் JavaScript மினிஃபையர்களைப் பயன்படுத்தவும்.
விருப்பமான மூடுதல் குறிச்சொற்களை அகற்றுவது பாதுகாப்பானதா?
HTML5 விவரக்குறிப்புக்கு ஆம், முடிவு படிக்க கடினமாக இருந்தாலும். சில அணிகள் இந்த மாற்றத்தை தெளிவுக்காக முடக்கி, சிறிய அளவு அபராதத்தை ஏற்றுக்கொள்கின்றன.
எனது HTML சேவையகத்தில் பதிவேற்றப்பட்டதா?
இல்லை. மினிஃபையர் உங்கள் உலாவியில் இயங்குகிறது.
இது html-minifier-terser உடன் எவ்வாறு ஒப்பிடப்படுகிறது?
html-minifier-terser என்பது நியமன Node.js HTML மினிஃபையர் ஆகும், மேலும் இது சற்று தீவிரமான முடிவுகளைத் தருகிறது. இந்தக் கருவி, பில்ட் செட்டப் இல்லாமலேயே உலாவியின் பக்க பயன்பாட்டிற்கான அதே மாற்றங்களை உள்ளடக்கியது.
நான் எப்பொழுதும் சிறுமைப்படுத்த வேண்டுமா அல்லது தேர்ந்தெடுக்க வேண்டுமா?
எப்போதும் உற்பத்திக்காக. பதிப்புக் கட்டுப்பாட்டில் மூலக் குறியீட்டிற்கு ஒருபோதும் இல்லை; மூலத்தில் படிக்கக்கூடிய HTML பராமரிப்புக்கு அவசியம்.