অপ্টিমাইজ বেছে নেওয়ার পরেই এই টুল SVGO-এর অফিসিয়াল ব্রাউজার ইঞ্জিন লোড করে। এটি স্ট্যান্ডার্ড প্লাগইন প্রিসেট ব্যবহার করে, নিরাপদ ওয়েব ব্যবহারের জন্য স্ক্রিপ্ট ও ইভেন্ট হ্যান্ডলার সরায় এবং CSS, JavaScript, গ্রেডিয়েন্ট, মাস্ক বা বাইরের রেফারেন্সে ব্যবহৃত ID রেখে দেওয়ার সুযোগ দেয়।
বিনামূল্যে SVG অপ্টিমাইজ করুন
পুরোটাই আপনার ব্রাউজারে চলে - কিছু আপলোড নেই, সাইন-আপ নেই।
SVG অপ্টিমাইজার কী করে?
SVG অপ্টিমাইজার এডিটরের মেটাডেটা, মন্তব্য, অপ্রয়োজনীয় অ্যাট্রিবিউট এবং বাড়তি দশমিক ঘর সরিয়ে ভেক্টর ফাইলের আকার কমায়। ব্রাউজারে SVGO চালাতে কোড পেস্ট করুন বা ফাইল বেছে নিন, আসল ও অপ্টিমাইজ করা সংস্করণের প্রিভিউ তুলনা করুন, তারপর আপনার ডিজাইন আপলোড না করেই ছোট SVG কপি বা ডাউনলোড করুন।
যেভাবে ব্যবহার করবেন
- 1SVG যোগ করুন. সম্পূর্ণ SVG মার্কআপ পেস্ট করুন, স্থানীয় .svg ফাইল আপলোড এলাকায় টেনে আনুন অথবা দেওয়া উদাহরণটি খুলুন।
- 2নিরাপদ সেটিং বেছে নিন. সংখ্যার নির্ভুলতা ঠিক করুন, বাড়তি সাশ্রয়ের জন্য multipass চালু রাখুন এবং অন্য কোড ID ব্যবহার করলে সেগুলো রেখে দিন।
- 3অপ্টিমাইজ করে তুলনা করুন. SVGO চালিয়ে আসল ও অপ্টিমাইজ করা সংস্করণের বাইট সংখ্যা এবং দুটি প্রিভিউ তুলনা করুন।
- 4কপি বা ডাউনলোড করুন. সংক্ষিপ্ত মার্কআপ কপি করুন অথবা আসল ডিজাইন না বদলে নতুন .optimized.svg ফাইল ডাউনলোড করুন।
কাদের জন্য
- Frontend ডেভেলপার যারা সাইট বা কম্পোনেন্ট লাইব্রেরিতে যোগ করার আগে আইকন, লোগো ও ইলাস্ট্রেশন ছোট করেন।
- ডিজাইনার যারা Figma, Illustrator, Sketch বা Inkscape থেকে এক্সপোর্ট করা ফাইলের মেটাডেটা ও এডিটর-নির্দিষ্ট মার্কআপ পরিষ্কার করেন।
- পারফরম্যান্স টিম যারা ওয়েব বান্ডেলে ভেক্টর অ্যাসেট প্রকাশের আগে UTF-8 বাইটের সঠিক সাশ্রয় মাপেন।
- কম্পোনেন্ট নির্মাতা যারা React, Vue, Svelte বা সাধারণ HTML-এর জন্য সংক্ষিপ্ত inline SVG মার্কআপ তৈরি করেন।
সাধারণ প্রশ্ন
এই SVG অপ্টিমাইজার কি বিনামূল্যের?
হ্যাঁ। অ্যাকাউন্ট, পেমেন্ট বা ইনস্টলেশন ছাড়াই SVG ফাইল অপ্টিমাইজ করা যায়। টুলটি UTF-8 বাইটে সঠিক পরিবর্তন দেখায় এবং ব্রাউজার থেকেই ফলাফল কপি বা ডাউনলোড করতে দেয়।
আমার SVG কি কোনো সার্ভারে আপলোড হয়?
না। ফাইল পড়া, SVGO প্রসেসিং, বাইট মাপা এবং প্রিভিউ তৈরি সবই ব্রাউজারে স্থানীয়ভাবে হয়। এই টুল আপনার লোগো, আইকন বা অপ্রকাশিত ডিজাইন আপলোড করে না।
কত বড় SVG ফাইল অপ্টিমাইজ করা যাবে?
টুলটি 5 MB পর্যন্ত SVG সোর্স গ্রহণ করে। এই সীমা ফোন ও সাধারণ ল্যাপটপে প্রসেসিং দ্রুত রাখে। খুব বড় এক্সপোর্ট করা ইলাস্ট্রেশনের ক্ষেত্রে embedded raster image সরান অথবা ডিজাইনটি ছোট ফাইলে ভাগ করুন।
অপ্টিমাইজ করলে SVG-এর চেহারা বদলাতে পারে?
অপ্রয়োজনীয় ডেটা সরানোর সময় রেন্ডারিং ঠিক রাখার জন্য SVGO তৈরি, তবে অতিরিক্ত rounding বা ID cleanup জটিল ফাইলে প্রভাব ফেলতে পারে। production asset বদলানোর আগে দুটি প্রিভিউ তুলনা করুন এবং অপ্টিমাইজ করা SVG আসল ব্যবহারের জায়গায় পরীক্ষা করুন।
দশমিক নির্ভুলতা কী বদলায়?
দশমিক নির্ভুলতা ঠিক করে SVGO coordinate, transform এবং অন্য numeric value-তে কতটি ঘর রাখবে। কম মানে সাধারণত বেশি বাইট সাশ্রয় হয়, তবে খুব সূক্ষ্ম বা অস্বাভাবিক বড় ডিজাইনের ছোট অংশ সরে যেতে পারে। বেশির ভাগ ওয়েব আইকন ও ইলাস্ট্রেশনের জন্য তিনটি ঘর ভালো ডিফল্ট।
SVG ID কি রেখে দেওয়া উচিত?
CSS, JavaScript, aria attribute, গ্রেডিয়েন্ট, মাস্ক, ফিল্টার বা বাইরের ডকুমেন্ট ID ব্যবহার করলে সেগুলো রেখে দিন। স্বতন্ত্র সাজসজ্জার ফাইলে এই অপশন বন্ধ করা যায়, যাতে SVGO অব্যবহৃত identifier সরাতে বা ছোট করতে পারে।
অপ্টিমাইজার কি SVG ফাইল থেকে স্ক্রিপ্ট সরায়?
হ্যাঁ। প্রসেসিং script element, event-handler attribute এবং JavaScript link সরায়। এতে এক্সপোর্ট করা ফাইল সাধারণ ওয়েব ইমেজ হিসেবে বেশি নিরাপদ হয়, তবে স্ক্রিপ্টের ওপর নির্ভরশীল SVG application-এর জন্য এই টুল উপযুক্ত নয়।
Multipass অপ্টিমাইজেশন কী করে?
Multipass চালু থাকলে পরের pass ফলাফল আরও ছোট করতে পারা পর্যন্ত SVGO আবার প্রসেস করে। কিছু পরিবর্তন পরের pass-এ নতুনভাবে পরিষ্কারের সুযোগ তৈরি করে। অতিরিক্ত সাশ্রয় সাধারণত কম, কারণ প্রথম pass-এই বেশির ভাগ আকার কমে যায়।