الصورة إلى Base64
حوّل صورة إلى data URI بترميز Base64 لتضمينها في HTML أو CSS أو JSON، بالكامل داخل متصفحك.
كيفية استخدام الصورة إلى Base64
- 01
اختر صورة من جهازك.
- 02
انسخ data URI، أو مقتطف CSS الجاهز.
- 03
الصقه في HTML أو CSS أو JSON الخاص بك.
ماذا يفعل هذا المحول
يقوم محول الصورة إلى Base64 بتحويل الصورة إلى URI للبيانات، وهي سلسلة نصية طويلة تتضمن الصورة مباشرة، بالإضافة إلى مقتطف خلفية CSS جاهز للاستخدام. يمكنك تضمين صورة بدلاً من الارتباط بملف منفصل.
يتم تشغيله محليًا في متصفحك، بحيث تتم قراءة صورتك على جهازك ولا يتم تحميلها مطلقًا.
لماذا تضمين الصورة
يحمل URI للبيانات الصورة بأكملها داخل الترميز، لذلك لا يقوم المتصفح بتقديم طلب شبكة منفصل لجلبها. بالنسبة للأصول الصغيرة مثل الرموز، يمكن أن يؤدي حفظها ذهابًا وإيابًا إلى جعل الصفحة تبدو أسرع.
المفاضلة: الحجم والتخزين المؤقت
المصيد هو الحجم والتخزين المؤقت. يضيف Base64 ما يقرب من 33 بالمائة من الحمل لأنه يمثل بيانات ثنائية بأبجدية نصية محدودة، ولا يمكن تخزين الصورة المضمنة مؤقتًا بشكل منفصل، لذلك يتم تنزيلها مرة أخرى مع كل صفحة تحتوي عليها.
القاعدة الأساسية هي تضمين الصور الصغيرة أو الأيقونات أو الشعارات الصغيرة أو الكائنات، حيث يكون تجنب الطلب يستحق كل هذا العناء، والاحتفاظ بالصور الأكبر حجمًا كملفات عادية يمكن للمتصفح تخزينها مؤقتًا وتحميلها بالتوازي.
حيث تعمل عناوين URI للبيانات
تعمل معرفات URI للبيانات في أي مكان يتم فيه قبول عنوان URL: img src، أو خلفية CSS، أو حقل في JSON أو قالب بريد إلكتروني. وهذا يجعلها مفيدة للمقتطفات المستقلة.
الأسئلة الشائعة
هل يتم رفع صورتي إلى خادم؟
لا. تُقرأ الصورة بالكامل داخل متصفحك، لذا لا تغادر جهازك أبدا.
متى ينبغي أن أستخدم data URI؟
للصور الصغيرة مثل الأيقونات، حيث يستحق تجنب طلب شبكة إضافي الزيادة في الحجم. أما الصور الكبيرة فالملف العادي أفضل لها.
لماذا يكون Base64 أكبر من الملف؟
يضيف ترميز Base64 نحو 33 بالمئة من العبء لأنه يمثل البيانات الثنائية باستخدام أبجدية نصية محدودة.