ToolsMaxxing

HTML, CSS ও JS মিনিফায়ার

ফাঁকা জায়গা, কমেন্ট ও বাড়তি বাইট সরিয়ে HTML, CSS ও JavaScript ছোট করুন।

আপনার ফাইল আপনার ডিভাইসেই থাকে

কীভাবে কাজ করে

  1. 1JavaScript, CSS বা HTML বাছুন।
  2. 2আপনার কোড পেস্ট করুন, অথবা “একটি উদাহরণ দেখুন” চাপুন।
  3. 3ওই ভাষার অপশনগুলো ঠিক করুন।
  4. 4মিনিফাই করা কোড কপি বা ডাউনলোড করুন, আর বাক্সের নিচের সাইজ লাইনটি দেখুন।

অপশনগুলো কী করে

JavaScript
Terser ব্যবহার করে কমেন্ট ও ফাঁকা জায়গা সরায়, এক্সপ্রেশন সহজ করে এবং অপ্রাপ্য কোড বাদ দেয়।
ভেরিয়েবলের নাম ছোট করুন
লোকাল ভেরিয়েবলকে এক অক্ষরের নাম দেয়। আপনার কোড রানটাইমে নাম পড়লে, যেমন eval দিয়ে, এটি বন্ধ রাখুন।
CSS
csso ব্যবহার করে রুল মেলায়, রং ও মান ছোট করে এবং কমেন্ট সরায়।
HTML
ফাঁকা জায়গা গুটিয়ে আনে এবং কমেন্ট ও বাড়তি অ্যাট্রিবিউট সরায়।
ইনলাইন CSS ও JS মিনিফাই করুন
HTML-এর style ও script ট্যাগের ভেতরের কোডও ছোট করে।

গোপনীয়তা

সবকিছু আপনার ব্রাউজারেই চলে। আপনার পেস্ট করা কোড কখনো কোনো সার্ভারে যায় না। প্রকাশ না হওয়া কোড আপনার ডিভাইসেই থাকে।

সবাই যা জানতে চান

মিনিফাই করা কোড কি ব্যবহার করা নিরাপদ?

মিনিফায়ার আচরণ একই রাখার জন্য বানানো, তবু ফলাফল পরীক্ষা করে নিন। যে কোড ফাংশনের নামের ওপর নির্ভর করে, eval ব্যবহার করে, বা যাতে সিনট্যাক্সের ভুল আছে তা ভেঙে যেতে পারে। আপনার আসল ফাইল রেখে দিন।

সিনট্যাক্স ভুল দেখাচ্ছে কেন?

ছোট করার আগে JavaScript পার্স করা হয়, তাই ব্র্যাকেট বাদ পড়ার মতো ভুলে টুল থেমে যায় এবং লাইন দেখায়। CSS ও HTML বেশি নমনীয়, প্রায়ই যেমন লেখা তেমনই মিনিফাই হয়।

আমার ফাইল কতটা ছোট হবে?

ফাঁকা জায়গা ও কমেন্ট কতটা আছে তার ওপর নির্ভর করে। হাতে লেখা ফাইল প্রায়ই 20 থেকে 60 শতাংশ ছোট হয়। সার্ভারে gzip বা Brotli চালু করলে আরও সাশ্রয় হয়।

আধুনিক JavaScript কি চলে?

হ্যাঁ। অ্যারো ফাংশন, ক্লাস, async ফাংশন ও অপশনাল চেইনিংয়ের মতো বর্তমান সিনট্যাক্স চলে। কোডকে পুরনো সিনট্যাক্সে রূপান্তর করা হয় না।

সোর্স ম্যাপ কি পাওয়া যায়?

না। এই টুল শুধু মিনিফাই করা কোড দেয়। ডিবাগের জন্য সোর্স ম্যাপ লাগলে আপনার বিল্ড টুল ব্যবহার করুন।

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