HTML মিনিফায়ার

কী কী সরানো হয়?

• কমেন্ট: <!-- … --> সরানো হয়, তবে Internet Explorer-এর conditional comment ও <!--! দিয়ে শুরু হওয়া কমেন্ট ছাড়া।
• ব্লক এলিমেন্টের মাঝের হোয়াইটস্পেস: <div>, <li> বা <head>-এর মতো ট্যাগের মাঝের নতুন লাইন ও ইনডেন্টেশন কখনো রেন্ডার হয় না, তাই পুরোপুরি বাদ দেওয়া হয়।
• টেক্সটে পরপর স্পেস: এগুলো একটি স্পেসে সংকুচিত হয়, যা ব্রাউজার এমনিতেও ঠিক সেভাবেই রেন্ডার করে।
• ট্যাগের ভেতরের হোয়াইটস্পেস: <p class = "a"> হয়ে যায় <p class="a">।

কী অপরিবর্তিত থাকে?

কিছু জায়গায় হোয়াইটস্পেস গুরুত্বপূর্ণ, এবং মিনিফায়ার তা মেনে চলে। <pre> ও <textarea>-এর কনটেন্ট বাইট-বাই-বাইট রাখা হয়। ইনলাইন এলিমেন্টের মাঝের একটি স্পেস, যেমন <b>bold</b> text, রাখা হয়, কারণ সেটি সরালে শব্দগুলো জুড়ে যেত। অ্যাট্রিবিউটের মান ও কোট কখনো বদলানো হয় না।

ইনলাইন CSS ও JavaScript

ইনলাইন <style> ব্লক CSSO দিয়ে এবং ইনলাইন <script> ব্লক Terser দিয়ে অপটিমাইজ করা হয়, যে ইঞ্জিনগুলো CSS মিনিফায়ার ও JavaScript মিনিফায়ার পেজেও ব্যবহৃত হয়। JSON-LD ও অন্যান্য JSON স্ক্রিপ্ট ব্লক সংকুচিত করা হয়, আর অজানা ধরনের স্ক্রিপ্ট (যেমন টেমপ্লেট) যেমন আছে তেমনই রাখা হয়।

HTML মিনিফিকেশন কি সার্থক?

সার্ভার-রেন্ডার করা পেজ ও স্ট্যাটিক সাইটে HTML ডকুমেন্টই ব্রাউজার প্রথমে ডাউনলোড করে, তাই প্রতিটি সাশ্রয়ী বাইট প্রথম রেন্ডারের সময় কমায়। কমপ্রেশনের আগে ১০–২৫% সাশ্রয় সাধারণ ব্যাপার, বেশি ইনডেন্ট করা টেমপ্লেট ও বড় ইনলাইন স্ক্রিপ্টযুক্ত পেজে আরও বেশি।