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

JPG ফাইল মানে ছবি, আর ছবি বড় হয়। এই একটি সত্যই আইকন এনকোড করার তুলনায় হিসাব বদলে দেয়: ২০০ KB-র একটি ছবি হয়ে যায় প্রায় ২৬৭ KB লেখা, যা ব্রাউজারকে পুরোটা নামাতে হয়, স্মৃতিতে রাখতে হয় এবং ডিকোড করতে হয় — তবেই সে কিছু দেখাতে পারে। বেশিরভাগ ওয়েবসাইটের জন্য এটি খারাপ বিনিময়। তবু তিনটি পরিস্থিতিতে এটিই ঠিক সিদ্ধান্ত।

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

1. 1 আপনার .jpg বা .jpeg ফাইলটি আপলোড অংশে ছাড়ুন।
2. 2 টুলটি যে আকারের লাইনটি দেখায় তা দেখুন — ইনলাইন করা যুক্তিসঙ্গত কি না তা এই সংখ্যাই ঠিক করে।
3. 3 HTML ও CSS-এর জন্য data URI কপি করুন, কিংবা JSON-এ রাখলে কাঁচা স্ট্রিং।

সাধারণ ওয়েব পৃষ্ঠার জন্য এটি সাধারণত ভুল

সাধারণ একটি ইমেজ ট্যাগ ব্রাউজারকে ছবিটি সমান্তরালে আনতে, মাসের পর মাস ক্যাশ করতে, পর্দার নিচে থাকলে একেবারেই এড়িয়ে যেতে, আর ফোনে ছোট সংস্করণ বসাতে দেয়। ইনলাইন করা এই চারটিই একসঙ্গে ফেলে দেয়। ছবিটি এখন HTML বা CSS-এর ভেতরে আসে, প্রথম রেন্ডার আটকায়, একা ক্যাশ হতে পারে না, যারা কখনো সেখানে স্ক্রল করে না তাদের কাছেও নামে, এবং 4K মনিটরে ও সস্তা ফোনে হুবহু একই থাকে। ছবি যত বড়, এর প্রতিটি খরচ তত ভারী।

তিনটি ক্ষেত্রে এটি সঠিক

প্রথমে ইমেইল টেমপ্লেট: বহু ক্লায়েন্ট ডিফল্টভাবে বাইরের ছবি আটকে দেয়, তাই নির্ভরযোগ্যভাবে দেখা যায় কেবল ইনলাইন করা ছবিটিই। দ্বিতীয়ত, ক্ষুদ্র প্লেসহোল্ডার — কয়েকশ বাইটের ইচ্ছাকৃতভাবে ঝাপসা একটি ছবি, ইনলাইন করা হয় যাতে আসল ছবি লোড হওয়ার সময় কিছু একটা দেখা যায়। তৃতীয়ত, এমন ব্যবস্থার মধ্য দিয়ে ছবি পাঠানো যা কেবল লেখা নেয়: JSON API, webhook পেলোড, ডেটাবেস কলাম, মেসেজ কিউ। তিনটিতেই বিকল্প "আরও দ্রুত ছবি" নয়; বিকল্প "কোনো ছবিই না"।

এনকোড করার আগে ছবিটি ছোট করুন

Base64-এর কাছে তাকে কী দেওয়া হলো তা নিয়ে কোনো মত নেই — ৩ MB-র ছুটির ছবিকেও সে থাম্বনেইলের মতোই বিশ্বস্তভাবে বড় করে। তাই কাজটি সঠিক ক্রমে করুন: যে মাপে সত্যিই দেখাবেন সেই মাপে ক্রপ করুন, পার্থক্য চোখে পড়া বন্ধ না হওয়া পর্যন্ত JPG মান কমান, তারপরেই এনকোড করুন। যে ছবি ৪০০ পিক্সেল চওড়া দেখানো হবে, তাকে ৪০০০-এ এনকোড করার কোনো কারণ নেই। এরপরেও ফল যদি কয়েকশ কিলোবাইট হয়, তবে সেটিই টুলের ইঙ্গিত — ফাইলে লিঙ্ক দিন।