আমার টুল

JS ও CSS মিনিফাই

কোড পেস্ট করুন, টাইপের সঙ্গে সঙ্গেই মিনিফাই করা সংস্করণ দেখা যায় — বাঁচা অক্ষরসহ।

কীভাবে ব্যবহার করবেন

  1. JavaScript বা CSS বাক্সে পেস্ট করুন — টাইপের সঙ্গে সঙ্গেই মিনিফাই করা সংস্করণ আসে, কোনো বোতাম চাপতে হয় না।
  2. সিনট্যাক্স অটো রাখুন, কিংবা শনাক্তকরণের অনুমান ভুল হলে নিজেই JavaScript / CSS বেছে নিন; ফলাফল সঙ্গে সঙ্গেই নতুন করে দেখায়।
  3. হেডারে বাঁচা অক্ষর সংখ্যা আগে → পরে দেখানো হয়। আউটপুট কপি করুন বা .js / .css ফাইল হিসেবে ডাউনলোড করুন।

উদাহরণ

ইনপুট

// Cart total with the free-shipping badge
const TAX = 0.08;

function total(items, coupon) {
  let sum = 0;
  for (const item of items) {
    sum += item.price * item.qty;
  }
  if (coupon) {
    sum -= coupon;
  }
  return { amount: sum * (1 + TAX), freeShipping: sum > 50 };
}

মিনিফাই করা

const TAX=0.08;function total(items,coupon){let sum=0;for(const item of items){sum+=item.price*item.qty;}if(coupon){sum-=coupon;}return{amount:sum*(1+TAX),freeShipping:sum>50};}

কমেন্ট মুছে গেছে, ফাঁকা জায়গা ভাঁজ হয়েছে, কিন্তু প্রতিটি শনাক্তকারীর নাম এবং প্রতিটি লিটারেল হুবহু আগের মতোই আছে। পাঠে দেখা যাচ্ছে 279 → 177 অক্ষর (−37%)।

নিয়ম, সীমাবদ্ধতা ও পরিচিত সমস্যা

  • শুধু ফাঁকা জায়গা ও কমেন্ট। কিছুই নাম বদলায় না, কোনো স্টেটমেন্ট মেলানো হয় না, কোনো কোড বাদ যায় না — তাই মিনিফাই করা আউটপুট আসল কোডের মতোই আচরণ করে, তবে Terser-এর ফলের চেয়ে বড় হয়।
  • /*! বা //! দিয়ে শুরু হওয়া কমেন্ট, এবং @license বা @preserve উল্লেখ থাকা কমেন্ট রাখা হয়; বাকি সব কমেন্ট মুছে যায়।
  • যেখানে বাদ দিলে প্রোগ্রামের অর্থ বদলে যায়, সেখানে লাইনভেক থেকে যায়: return / throw / break / continue / yield / async-এর পরে, এবং এমন দুই স্টেটমেন্টের মাঝে যেগুলোর জোড়া লাগানোর পর JavaScript স্বয়ংক্রিয়ভাবে সেমিকোলন বসায় (a\nb, x={}\nfoo())। বাকি বেশিরভাগ কোড এক লাইনে নেমে আসে।
  • JavaScript টোকেনাইজ করা হয়, parse করা হয় না: স্ট্রিং, রেগুলার এক্সপ্রেশন বা টেমপ্লেট লিটারেলের ভেতরের "/*" কখনো ছোঁয়া হয় না। ভাগফল আর রেগুলার এক্সপ্রেশন আগে কোন টোকেন ছিল বলে আলাদা করা হয়; লাইন জুড়ে থাকা regex-কে ভাগফল হিসেবেই ধরা হয়।
  • CSS থেকে শুধু এমন ফাঁকা জায়গাই বাদ যায় যার কোনো অর্থ থাকতে পারে না: { } ; , > ~ !-এর দুপাশে এবং ":"-এর পরে, আর "}"-এর আগের শেষ ";"। Descendant স্পেস থেকে যায় (.a .b মানে .a.b নয়), ":"-এর আগের স্পেস থেকে যায় (a :hover মানে a:hover নয়), আর calc(100% - 10px) তার স্পেস রাখে কারণ সেগুলো সিনট্যাক্সের অংশ।
  • রেনেমিং (mangle) নেই, ডেড-কোড রিমুভাল নেই, drop_console নেই: এগুলো আচরণ বদলে দেয়, আর একটি "মিনিফাই" বোতামের কাজ লুকিয়ে সেটা করা নয়।
  • অসমর্থিত: HTML/SVG (সেখানে ফাঁকা জায়গা <pre>, <textarea> ও ইনলাইন এলিমেন্টের উপর নির্ভরশীল), TypeScript-এর টাইপ-স্তরের সংশোধন, JSX/TSX ইনপুট, source map ও একাধিক ফাইল একত্র। JSX শনাক্ত হলে সতর্কবাণী দেখানো হয়।
  • ইনপুটের শেষে খোলা স্ট্রিং, টেমপ্লেট, কমেন্ট বা url( থাকলে সেটি ভুল নয়, সতর্কতা: বাকি কোড তবুও মিনিফাই হয়। অমিল ব্র্যাকেটও সতর্কতা — এটি ভ্যালিডেটর নয়।
  • পাঠগুলো Unicode code point গনে, বাইট বা UTF-16 ইউনিট নয়; শতাংশ পূর্ণসংখ্যায় ঘোরাকৃত এবং আউটপুট বাড়লে +n% দেখানো হয়। সবকিছু আপনার ব্রাউজারে চলে: কিছুই আপলোড হয় না, সংরক্ষিত হয় না বা URL-এ যোগ হয় না।
  • 200,000-এর বেশি অক্ষর হলে টাইপ করা থামার প্রায় 0.6 সেকেন্ড পর ফলাফল হালনাগাদ হয়; টেক্সট কখনো ছেঁটে ফেলা হয় না। আউটপুট LF ব্যবহার করে এবং শেষে নতুন লাইন নেই।

কোড ছোট হওয়ার পর মানুষ সাধারণত যা চায়।

কোড ফরম্যাটার (beautifier)

JSON টুলবক্স

XML ফরম্যাটার