WebP থেকে Base64 রূপান্তর - বিনামূল্যে, তাৎক্ষণিক, ব্রাউজারেই

WebP এমনিতেই ছোটটি। PNG-তে যে ফাইল ৪০ KB হতো, WebP-তে তা প্রায়ই ১৫ KB-র আশপাশে নামে; অর্থাৎ Base64 যে ৩৩% যোগ করে তা পরম হিসাবে অন্য যেকোনো ফরম্যাটের চেয়ে কম লাগে। এটি WebP-কে ইনলাইন করার জন্য অস্বাভাবিকভাবে ভালো প্রার্থী করে তোলে — আকারের সঙ্গে সম্পর্কহীন একটি খটকা বাদ দিলে।

কীভাবে WebP থেকে Base64 রূপান্তর করবেন

1. 1 আপনার .webp ফাইলটি আপলোড অংশে ছাড়ুন।
2. 2 এনকোড করা রূপগুলো সঙ্গে সঙ্গেই আসে, সেই সঙ্গে আগের ও পরের আকারও।
3. 3 যেটি মানানসই সেটি কপি করুন: data URI, কাঁচা স্ট্রিং, বা CSS নিয়ম।

ইনলাইন করা আপনার ফলব্যাক সরিয়ে দেয়

WebP পরিবেশনের স্বাভাবিক উপায় হলো একটি picture এলিমেন্ট, যা আগে WebP আর পরে JPG বা PNG দেয়, যাতে প্রতিটি ব্রাউজার যা বোঝে তা-ই নেয়। data URI তা পারে না: এটি একটিমাত্র মিডিয়া টাইপযুক্ত একটিমাত্র স্ট্রিং, আর যে ব্রাউজার WebP ডিকোড করতে পারে না সে স্রেফ কিছুই দেখায় না। আজ সমর্থন খুব ব্যাপক, তাই খোলা ওয়েবে এটি কদাচিৎ কামড়ায় — কিন্তু ইমেইল ক্লায়েন্টে, পুরোনো এমবেডেড ব্রাউজারে এবং পুরোনো ইঞ্জিনে HTML আঁকা ডেস্কটপ অ্যাপে ঠিকই কামড়ায়।

কোথায় ভালো মানায়

যেখানেই আপনি চালানোর পরিবেশ নিয়ন্ত্রণ করেন এবং জানেন WebP ডিকোড হবে: অভ্যন্তরীণ ড্যাশবোর্ড, অ্যাডমিন প্যানেল, ব্রাউজার এক্সটেনশন, Electron অ্যাপ, কিংবা কেবল আধুনিক দর্শকের জন্য বানানো ডিজাইন সিস্টেম। এসব জায়গায় WebP-র সংকোচন আর বাড়তি অনুরোধ না থাকা — দুটোই একসঙ্গে পান, যা ইনলাইন করার প্রায় সর্বোত্তম রূপ। কিন্তু প্রকাশ্য বিপণন পৃষ্ঠায়, যেখানে শতাংশের ভগ্নাংশ দর্শকও গুরুত্বপূর্ণ, সেখানে picture এলিমেন্ট ও সাধারণ ফাইলকেই বেছে নিন।

বড় ক্ষতিটি এখনও ক্যাশিং

WebP ফাইল ছোট বলেই মানুষ অনেকগুলো ইনলাইন করতে প্রলুব্ধ হয়। দ্বিতীয় খরচটি ঠিক সেখানেই গুণ হয়: প্রতিটি ইনলাইন করা ছবি স্টাইলশিটের ভেতরেই থাকে, তাই CSS-এর একটি লাইনে একটিমাত্র পরিবর্তন সবগুলোকে একসঙ্গে বাতিল করে দেয় এবং দর্শক পুরো সেটটি আবার নামায়। দশটি ছোট ছবি ইনলাইন করা সহজেই দশটি ক্যাশ করা ফাইলের চেয়ে খারাপ হতে পারে। সংখ্যা কম রাখুন, প্রতিটি যেন সত্যিই ক্ষুদ্র হয়, আর বাকিগুলো সাধারণ ফাইল হিসেবেই থাকতে দিন যেগুলো ব্রাউজার ক্যাশ করে পৃষ্ঠায় পৃষ্ঠায় পুনর্ব্যবহার করতে পারে।