Loading...

مساعدة CDN.com.tr

تحسين الصور: AVIF وWebP على الحافة

فعّل تحسين الصور للحساب أو لقاعدة تسليم واحدة واختر WebP أو WebP + AVIF: تحوّل الحافة صور JPEG وPNG وترسل لكل متصفح صيغة يقبلها، وتبقى روابط الصور في صفحاتك كما هي.

تحسين الصور: AVIF وWebP على الحافة

فعّل تحسين الصور للحساب أو لقاعدة تسليم واحدة واختر WebP أو WebP + AVIF: تحوّل الحافة صور JPEG وPNG وترسل لكل متصفح صيغة يقبلها، وتبقى روابط الصور في صفحاتك كما هي.

أدلة ذات صلة

القياسات التي يقوم عليها اختيار التنسيق، وفاحص لأي صفحة، ودليل التفريغ.

اختيار التنسيق

AVIF أم WebP: بالقياس

أي تنسيق أصغر في الصور الفوتوغرافية ولقطات الشاشة والأيقونات، بالبايتات.

اقرأ الدليل
أي صفحة

فاحص تنسيق الصور

التنسيق الذي تصل به صور صفحة ما إلى متصفح حديث وإلى عميل بسيط.

افتح الفاحص
بعد التفعيل

مسح المحتوى المخزَّن مؤقتاً

امسح النسخ المخزّنة قبل التفعيل لتُحوَّل من جديد.

افتح الموضوع

مسار اللوحة

  1. لوحة الإدارة
  2. قواعد التسليم
  3. تحسين الصور
  4. تنسيق الصور

المتطلبات المسبقة

  • حساب CDN يُقدَّم موقعه عبر الحافة.
  • دور المالك أو المحرّر: يستطيع المشاهدون رؤية الإعدادات وتشغيل فحص الصور، لكن لا يستطيعون تغييرها.
  • اعرف أي المسارات تحتاج إلى حماية الروابط الخارجية أو روابط موقّعة أو حدّ لمعدل الطلبات: القاعدة التي يعمل فيها تحسين الصور لا تطبّق أيًّا منها، ومفتاح الحساب يرفعها عن ملفات JPEG وPNG.

نموذج القرار

الحساب كله أم قاعدة واحدة؟

يشمل مفتاح الحساب ملفات JPEG وPNG في جميع القواعد. أما مفتاح القاعدة فيشمل مسارات تلك القاعدة فقط، وهي طريقة جيدة لتجربته أولًا على مجلد واحد أو نطاق واحد.

  • على مستوى الحساب: لموقع صوره عامة
  • لكل قاعدة: مجلد أو نطاق أولًا، وتحتفظ القواعد الأخرى بحمايتها

WebP أم WebP + AVIF؟

يُختار التنسيق مرة واحدة للحساب، ويُطبَّق حيثما كان تحسين الصور مفعّلًا.

  • WebP: كل المتصفحات المستخدمة تقريبًا، وكلفة معالجة أقل
  • WebP + AVIF (تلقائي): AVIF للمتصفحات التي تقبله، وهو عادةً الأصغر في الصور

دليل خطوة بخطوة

1

فعّل تحسين الصور

مفتاح الحساب هو أسرع بداية؛ ومفتاح القاعدة يحصر التحسين في مسارات تلك القاعدة.

  • افتح قواعد التسليم واختر الحساب.
  • فعّل تحسين الصور على مستوى الحساب، أو افتح قاعدة وفعّل تحسين الصور فيها.
  • احفظ وانتظر حتى يُنشَر التغيير على الحافة.

النتيجة المتوقعة: تُحوَّل طلبات JPEG وPNG على تلك المسارات على الحافة.

cdnctl equivalent
curl -s -X POST -H "Authorization: Bearer $CDN_TOKEN" -H 'Content-Type: application/json' -d '{"type":1}' https://cdn.com.tr/api/accounts/$ACCOUNT_UUID/image_optimization
# لقاعدة واحدة فقط: ضع "image_optimization":"on" في JSON القاعدة
cdnctl cdn advanced-rules create --account "$ACCOUNT_UUID" --file rule-images.json
2

اختر التنسيق

يُطبَّق التنسيق حيثما كان تحسين الصور مفعّلًا، على مستوى الحساب أو في قاعدة.

  • من تنسيق الصور اختر WebP أو WebP + AVIF (تلقائي).
  • اقرأ المعدّل المعروض أسفل التنسيق قبل الحفظ.

النتيجة المتوقعة: مع WebP + AVIF تحصل المتصفحات التي تقبل AVIF على AVIF من الروابط نفسها؛ ويحصل غيرها على WebP أو الصورة بصيغتها الأصلية.

cdnctl equivalent
curl -s -X POST -H "Authorization: Bearer $CDN_TOKEN" -H 'Content-Type: application/json' -d '{"enabled":true}' https://cdn.com.tr/api/accounts/$ACCOUNT_UUID/image_avif
3

أفرغ ثم افحص

تحتفظ الصور المخزّنة مؤقتًا قبل تفعيل التحسين بتنسيقها القديم حتى تنتهي صلاحيتها، لذا أفرغ مسارات الصور بعد التفعيل. أما تغيير التنسيق فلا يحتاج إلى تفريغ.

  • أفرغ مجلدات الصور، أو كل شيء، من تنظيف الذاكرة المؤقتة.
  • شغّل فحص تنسيق الصور أسفل المفتاح على أحد نطاقات الحساب.

النتيجة المتوقعة: يعرض الفحص كل صورة بالتنسيق والحجم اللذين يتلقّاهما متصفح حديث؛ وحين يحتفظ المحسِّن بالأصل لأن التحويل لم يكن أصغر، يذكر السطر ذلك.

cdnctl equivalent
cdnctl purge --account "$ACCOUNT_UUID" --path /wp-content/uploads/ --type prefix
curl -s -H "Authorization: Bearer $CDN_TOKEN" "https://cdn.com.tr/api/accounts/$ACCOUNT_UUID/image_check?host=www.example.com"

التحقق

  • curl -sLo /dev/null -w '%{content_type} %{size_download}\n' -H 'Accept: image/avif,image/webp,*/*' https://www.example.com/photo.jpg → image/avif أو image/webp (مع WebP وحده: image/webp بعد إعادة التوجيه)، ما لم يكن الملف المحوَّل غير أصغر
  • curl -s -D - -o /dev/null -H 'Accept: image/webp,*/*' https://www.example.com/photo.jpg | grep -iE '^(vary|location)' → WebP + AVIF: Vary: Accept؛ WebP وحده: Location: …/photo.jpg.webp
  • curl -so /dev/null -w '%{content_type}\n' -H 'Accept: */*' https://www.example.com/photo.jpg → image/jpeg، أي الصيغة الأصلية

حالات الاستخدام

متجر يريد صور منتجات أخف دون إعادة تصدير مكتبة الوسائط، ودون تثبيت إضافة، ودون تغيير رابط صورة واحد.

سير عمل سريع

  1. افتح قواعد التسليم للحساب.
  2. فعّل تحسين الصور على مستوى الحساب، أو فعّله في قاعدة واحدة لتبدأ بمسارات تلك القاعدة.
  3. من تنسيق الصور اختر للحساب WebP أو WebP + AVIF (تلقائي).
  4. أفرغ الصور المخزّنة مؤقتًا، ثم شغّل فحص تنسيق الصور الموجود أسفل المفتاح.

الفحوصات

  • يُحوَّل: ملفات JPEG وPNG (.jpg و.jpeg و.png). أما GIF وSVG والملفات التي هي .webp أصلًا فتخرج دون تغيير.
  • تعتمد طريقة وصول الصيغة إلى المتصفح على تنسيق الحساب. مع WebP + AVIF يجيب رابط واحد كل المتصفحات: تقرأ الحافة ترويسة Accept في المتصفح، وترسل AVIF أو WebP أو الصورة بصيغتها الأصلية، وتجيب مع Vary: Accept. ومع WebP وحده يُعاد توجيه المتصفحات التي تقبل WebP (302) إلى نسخة WebP تحمل الاسم نفسه مع .webp في آخره (photo.jpg.webp)، ويحصل غيرها على الصورة بصيغتها الأصلية. وفي الحالتين تبقى روابط الصور في شيفرة HTML كما هي.
  • بالحجم الكامل لا تُرسَل الصورة المحوَّلة حديثًا إلا إذا كانت أصغر من الأصل: ملف AVIF ليس أصغر يترك مكانه لـWebP، وملف WebP ليس أصغر يترك مكانه للأصل. أما الصور التي يُغيَّر حجمها بـ?w= أو ?h= فلا تُقارَن.
  • إذا فشل التحويل تقدّم الحافة الصورة الأصلية بدلًا منها.
  • تُحفظ الصور المحوَّلة 365 يومًا، على الحافة وفي المتصفحات. والنسخ المخزّنة مؤقتًا قبل تفعيل التحسين تحتفظ بتنسيقها القديم حتى تنتهي صلاحيتها أو تفرغها أنت. أما تغيير التنسيق فلا يحتاج إلى تفريغ: تحفظ الحافة كل تنسيق على حدة، فيحصل الزوار الجدد على التنسيق الجديد فورًا، بينما قد يحتفظ متصفح حمّل الصورة من قبل بنسخته حتى عام.
  • حماية الروابط الخارجية (hotlink) والروابط الموقّعة وحدّ معدل الطلبات: القاعدة التي يعمل فيها تحسين الصور لا تطبّق أيًّا منها على أي ملف تقدّمه. ومع تفعيل مفتاح الحساب تتجاوزها ملفات JPEG وPNG في كل قاعدة ليس لها مفتاح خاص بها. أبقِ تحسين الصور معطّلًا في أي قاعدة تحتاج ملفاتها إلى هذه الحماية، وأبقِ مفتاح الحساب معطّلًا أيضًا إن كانت ملفات JPEG وPNG فيها تحتاج إليها. ولا يمكن استخدام تحسين الصور في قاعدة مسار مطابق تمامًا.
  • تُحتسب المعالجة من حصتك الشهرية، وAVIF بمعدّل أعلى من WebP. وتعرض اللوحة المعدّل الحالي أسفل المفتاح.

الأسئلة الشائعة

لماذا لا تزال بعض الصور تصل بصيغة JPEG أو PNG؟

في الغالب خُزّنت النسخة مؤقتًا قبل تفعيل التحسين: أفرغ تلك المسارات واطلبها من جديد. ومن الأسباب الأخرى: لم يكن التحويل بالحجم الكامل أصغر من الأصل، أو أن المتصفح لا يقبل WebP ولا AVIF، أو أن الطلب لم يطلب صيغة صورة بعينها (طلب curl العادي يرسل Accept: */*). ويعرض فحص تنسيق الصور في صفحة قواعد التسليم، صورةً صورة، ما يتلقّاه متصفح حديث وعميل بسيط.

هل يمكنني تغيير حجم الصور عبر الرابط؟

نعم. أضف ?w= (العرض) أو ?h= (الارتفاع) أو كليهما إلى رابط الصورة. قيمة واحدة تحافظ على نسبة الأبعاد، والقيمتان معًا تُدخلان الصورة في ذلك الإطار، ولا تُكبَّر أي صورة فوق حجمها الأصلي. أبقِ w وh ضمن مفتاح التخزين المؤقت لتلك القاعدة (القيمة الافتراضية، أي سلسلة الاستعلام كاملة، تفعل ذلك): القاعدة التي تتجاهل كل معاملات الاستعلام تخزّن حجمًا واحدًا لها جميعًا. والصور التي يُغيَّر حجمها تُحوَّل أيضًا، لكنها لا تُقارَن بالأصل.

كيف يُحتسب؟

لا توجد باقة منفصلة. تُحتسب المعالجة من الحصة الشهرية للحساب كما تُحتسب حركة المرور: يُحتسب كل تحويل بحجم الأصل الذي يقرؤه مضافًا إليه الصورة التي يعيدها، ويُحتسب AVIF بمعدّل أعلى من WebP لأن ترميزه يتطلب معالجة أكثر. وتعرض اللوحة المعدّل الحالي أسفل المفتاح، وتعرض صفحة استهلاك البيانات تحسين الصور في سطر خاص.

هل أحتاج إلى WebP + AVIF؟

هو خيار لا شرط. يصل WebP وحده إلى كل المتصفحات المستخدمة تقريبًا. ويضيف WebP + AVIF صيغة AVIF للمتصفحات التي تقبلها، وهي عادةً الأصغر في الصور الفوتوغرافية: في قياسنا خرجت صورة JPEG حجمها 262,025 بايت بصيغة AVIF في 86,936 بايت. شغّل فاحص تنسيق الصور على صفحاتك لترى الفرق.