বিনামূল্যে HTML বিউটিফায়ার ও মিনিফায়ার

কিভাবে কাজ করে

এই টুল পেজে সরাসরি তৈরি একটি হাতে লেখা ট্যাগ-সচেতন টোকেনাইজার দিয়ে HTML ফরম্যাট বা কম্প্রেস করে — কোনো তৃতীয় পক্ষের ফরম্যাটিং লাইব্রেরি বা সার্ভার আসা-যাওয়া নেই। টাইপ বা পেস্ট করার মুহূর্তেই আপনার মার্কআপের প্রতিটি অক্ষর ব্রাউজারে লোকালি প্রক্রিয়া হয়।

1. 1
   টোকেনাইজার মার্কআপ স্ক্যান করে

   একটি কাস্টম অক্ষর-ধরে-ধরে স্ক্যানার HTML স্ট্রিং পড়ে কমেন্ট, DOCTYPE ঘোষণা, খোলা ট্যাগ, বন্ধ ট্যাগ, স্ব-বন্ধ void এলিমেন্ট (br, img, input ইত্যাদি) এবং কাঁচা টেক্সট নোড শনাক্ত করে। একটি বিশেষ হেল্পার উদ্ধৃত অ্যাট্রিবিউট মান মনে রাখে, তাই অ্যাট্রিবিউটের ভেতরের > (যেমন value="a>b") কখনো ট্যাগকে আগেভাগে ভাঙে না।
2. 2
   প্রতি ট্যাগে ইনডেন্টেশনের গভীরতা ট্র্যাক হয়

   Beautify মোডে টোকেনাইজার একটি গভীরতা কাউন্টার রাখে। ব্লক-স্তরের খোলা ট্যাগ গভীরতা বাড়ায়; বন্ধ ট্যাগ লেখার আগে তা কমায়। ইনলাইন এলিমেন্ট (span, a, strong, em ইত্যাদি) নিজস্ব ইনডেন্ট করা লাইনে না গিয়ে বিষয়বস্তুর সাথে একই লাইনে থাকে। pre, script, style ও textarea-র মতো ট্যাগের ভেতরের বিষয়বস্তু হুবহু লেখা হয়, যাতে হোয়াইটস্পেস-সংবেদনশীল বা চালানো যায় এমন কোড নষ্ট না হয়।
3. 3
   Minifier নিরাপদে হোয়াইটস্পেস সংকুচিত করে

   Minify মোডে হোয়াইটস্পেস সংকোচনের আগে pre, script, style ও textarea ব্লকের বিষয়বস্তু নম্বরযুক্ত sentinel দিয়ে সরিয়ে রাখা হয়। HTML কমেন্ট সরানো হয়, এবং ট্যাগের মাঝের হোয়াইটস্পেস বাদ যায় — পাশাপাশি ইনলাইন এলিমেন্টের মাঝে ছাড়া, যেখানে একটি স্পেস রাখা হয় যাতে শব্দগুলো জুড়ে না যায়। তারপর sentinel প্লেসহোল্ডারগুলো মূল বিষয়বস্তুতে ফিরিয়ে আনা হয়।
4. 4
   আউটপুট দেখানো ও ঐচ্ছিকভাবে সেভ

   ফরম্যাট বা minify করা ফলাফল আকার পরিবর্তনের শতাংশসহ আউটপুট প্যানেলে লাইভ দেখা যায়। ব্রাউজার না ছেড়েই ক্লিপবোর্ডে কপি বা .html ফাইল হিসেবে ডাউনলোড করতে পারেন।

সম্পর্কিত টুলস