إنّ الإعلانات التي تستهلك قدرًا غير متناسب من الموارد على أحد الأجهزة تؤثر سلبًا في تجربة المستخدم، بدءًا من الآثار الواضحة لانخفاض الأداء وصولاً إلى العواقب الأقل وضوحًا، مثل استنزاف البطارية أو استهلاك معدّلات نقل البيانات. وتتراوح هذه الإعلانات بين الإعلانات الضارّة بشكل نشط، مثل تطبيقات تعدين العملات المشفّرة، والإعلانات التي تعرض محتوًى أصليًا يتضمّن أخطاء غير مقصودة أو مشاكل في الأداء.
يضع Chrome حدودًا على الموارد التي يمكن للإعلان استخدامها ويزيل هذا الإعلان في حال تجاوز الحدود. يمكنك قراءة الإعلان على مدونة Chromium لمزيد من التفاصيل. الآلية المستخدَمة لإلغاء تحميل الإعلانات هي التدخل المُكثّف في الإعلانات.
معايير الإعلانات ذات الكثافة العالية
يُعتبر الإعلان ثقيلًا إذا لم يتفاعل المستخدم معه (على سبيل المثال، لم ينقر عليه أو لم ينقر عليه) وكان يستوفي أيًا من المعايير التالية:
- استخدام سلسلة المحادثات الرئيسية لأكثر من 60 ثانية في المجمل
- استخدام سلسلة المحادثات الرئيسية لأكثر من 15 ثانية في أي نافذة مدتها 30 ثانية
- يستخدم أكثر من 4 ميغابايت من معدل نقل البيانات للشبكة.
يتم احتساب جميع الموارد التي يستخدمها أي إطارات iframe تابعة لإطار الإعلان ضمن حدود التدخل في ذلك الإعلان. يُرجى العلم أنّ حدود وقت المعالجة في سلسلة المهام الرئيسية ليست هي نفسها الوقت المنقضي منذ تحميل الإعلان. ترتبط الحدود القصوى بمدّة استغراق وحدة المعالجة المركزية لتنفيذ رمز الإعلان.
اختبار التدخل
تم طرح التدخل في الإصدار 85 من Chrome، ولكن يتم تلقائيًا إضافة بعض التشويش وvariability إلى الحدود الدنيا لحماية خصوصية المستخدم.
ويؤدي ضبط chrome://flags/#heavy-ad-privacy-mitigations على غير مفعَّل إلى إزالة إجراءات الحماية هذه،
أي أنّه يتم تطبيق القيود بشكل قاطع
وفقًا للحدود تمامًا. من المفترض أن يسهّل ذلك تصحيح الأخطاء والاختبار.
عند بدء التدخل، من المفترض أن يظهر المحتوى في إطار iframe لإعلان ثقيل تم استبداله برسالة تمّت إزالة الإعلان. إذا نقرت على رابط التفاصيل المضمّن، ستظهر لك رسالة توضّح ما يلي: "يستخدم هذا الإعلان موارد كثيرة جدًا لجهازك، لذلك أزاله متصفّح Chrome."
يمكنك معرفة التدخل المطبّق على عيّنة من المحتوى على heavy-ads.glitch.me يمكنك أيضًا استخدام هذا الموقع الإلكتروني التجريبي لتحميل عنوان URL عشوائي كطريقة سريعة لاختبار المحتوى الخاص بك.
يُرجى العِلم أنّ هناك عددًا من الأسباب التي قد تمنع تطبيق أحد التدخلات أثناء الاختبار.
- سيؤدي إعادة تحميل الإعلان نفسه ضمن الصفحة نفسها إلى استثناء هذه التركيبة من التدخل. يمكن أن يساعدك محو سجلّ التصفّح وفتح الصفحة في علامة تبويب جديدة.
- يُرجى التأكّد من بقاء الصفحة محل التركيز، لأنّ الانتقال إلى الخلفية (أي الانتقال إلى نافذة أخرى) سيؤدي إلى إيقاف قوائم الانتظار الخاصة بالصفحة مؤقتًا، وبالتالي لن يتم تدخل وحدة المعالجة المركزية (CPU).
- تأكَّد من عدم النقر على محتوى الإعلان أثناء الاختبار، ولن يتم تطبيق التدخل على المحتوى الذي يتلقّى أي تفاعل من المستخدم.
الإجراءات المطلوبة منك
إذا كنت تعرض إعلانات من مقدّم خدمة خارجي على موقعك الإلكتروني
ليس عليك اتّخاذ أي إجراء، ولكن يُرجى العِلم أنّه قد تظهر للمستخدمين إعلانات تتجاوز الحدود المُزالة عند زيارتهم موقعك الإلكتروني.
إذا كنت تعرض إعلانات الطرف الأول على موقعك الإلكتروني أو تقدّم إعلانات صورية تابعة لجهة خارجية
تابِع القراءة للتأكّد من تنفيذ عمليات المراقبة اللازمة من خلال Reporting API لعمليات التدخل في الإعلانات المكثّفة.
إنشاء محتوى إعلاني أو صيانة أداة لإنشاء محتوى إعلاني
تابِع القراءة للتعرّف على كيفية اختبار المحتوى بحثًا عن مشاكل الأداء واستخدام الموارد. يجب أيضًا الرجوع إلى الإرشادات المتعلقة بمنصّات عرض الإعلانات التي تختارها، لأنّها قد تقدّم نصائح فنية إضافية أو قيودًا. على سبيل المثال، يمكنك الاطّلاع على إرشادات Google بشأن تصاميم الإعلانات الصورية. ننصحك بإنشاء حدود قابلة للضبط مباشرةً في أدوات الإنشاء لمنع عرض الإعلانات المنخفضة الأداء.
ماذا يحدث عند إزالة إعلان؟
يتم الإبلاغ عن التدخل في Chrome من خلال واجهة برمجة التطبيقات المُسمّاة بشكل مناسب
Reporting API
باستخدام نوع تقرير intervention. يمكنك استخدام Reporting API للحصول على إشعارات
بشأن التدخلات، إما من خلال طلب POST إلى نقطة نهاية إعداد التقارير أو ضمن
JavaScript.
يتم تنشيط هذه التقارير في إطار iframe الجذر الذي تم وضع علامة عليه للإعلانات، بالإضافة إلى جميع العناصر الفرعية، أي كل إطار تم إلغاء تحميله من خلال التدخل. وهذا يعني أنّه إذا كان الإعلان مصدره جهة خارجية، أي إطار iframe على مستوى الموقع الإلكتروني، يكون الأمر متروكًا لجهة الخارجية تلك (مثل مزوّد الإعلانات) لمعالجة التقرير.
لضبط الصفحة لتتوافق مع تقارير HTTP، يجب أن تتضمّن الاستجابة
عنوان Report-To:
Report-To: { "url": "https://example.com/reports", "max_age": 86400 }
سيتضمّن طلب POST الذي تم تشغيله تقريرًا على النحو التالي:
POST /reports HTTP/1.1
Host: example.com
…
Content-Type: application/report
[{
"type": "intervention",
"age": 60,
"url": "https://example.com/url/of/ad.html",
"body": {
"sourceFile": null,
"lineNumber": null,
"columnNumber": null,
"id": "HeavyAdIntervention",
"message": "Ad was removed because its CPU usage exceeded the limit. See https://www.chromestatus.com/feature/4800491902992384"
}
}]
توفّر واجهة برمجة التطبيقات JavaScript للعنصر ReportingObserver طريقة observe()
يمكن استخدامها لتشغيل دالة ردّ اتصال مقدَّمة عند إجراء التدخلات. يمكن أن يكون ذلك مفيداً
إذا أردت إرفاق معلومات إضافية بالتقرير للمساعدة في
تصحيح الأخطاء.
// callback that will handle intervention reports
function sendReports(reports) {
for (let report of reports) {
// Log the `report` json via your own reporting process
navigator.sendBeacon('https://report.example/your-endpoint', report);
}
}
// create the observer with the callback
const observer = new ReportingObserver(
(reports, observer) => {
sendReports(reports);
},
{ buffered: true }
);
// start watching for interventions
observer.observe();
ومع ذلك، ونظرًا لأن التدخل سيؤدي إلى إزالة الصفحة من إطار iframe حرفيًا، يجب إضافة عامل أمان من الإخفاق لضمان تسجيل التقرير بالتأكيد قبل اختفاء الصفحة تمامًا، مثل إعلان ضمن iframe. لهذا الغرض، يمكنك ربط طلب الاستدعاء نفسه بالحدث pagehide.
window.addEventListener('pagehide', (event) => {
// pull all pending reports from the queue
let reports = observer.takeRecords();
sendReports(reports);
});
يُرجى تذكُّر أنّه لحماية تجربة المستخدم، يفرض الحدث pagehide قيودًا على
مقدار العمل الذي يمكن أن يحدث خلاله. على سبيل المثال، سيؤدي محاولة إرسال طلب
fetch() مع التقارير إلى إلغاء هذا الطلب.
يجب استخدام navigator.sendBeacon() لإرسال هذا التقرير، ومع ذلك، فإنّه
يُرجى العِلم أنّه يتم بذل قصارى الإمكان من قِبل المتصفّح لحلّ هذه المشكلة، ولكن لا يمكن ضمان حلّها.
إنّ ملف JSON الناتج من JavaScript يشبه ملف JSON الذي تم إرساله في طلب POST:
[
{
type: 'intervention',
url: 'https://example.com/url/of/ad.html',
body: {
sourceFile: null,
lineNumber: null,
columnNumber: null,
id: 'HeavyAdIntervention',
message:
'Ad was removed because its network usage exceeded the limit. See https://www.chromestatus.com/feature/4800491902992384',
},
},
];
تشخيص سبب التدخل
محتوى الإعلانات هو محتوى ويب فقط، لذا استخدِم أدوات مثل Lighthouse لتدقيق الأداء العام ل المحتوى. توفر عمليات التدقيق الناتجة إرشادات مضمنة حول التحسينات. ويمكنك أيضًا الرجوع إلى مجموعة web.dev/Fast.
قد يكون من المفيد اختبار إعلانك في سياق أكثر عزلة. يمكنك استخدام خيار عنوان URL المخصّص على https://heavy-ads.glitch.me لاختبار ذلك باستخدام ملف div مضمّن مُعدّ مسبقًا ومُصنَّف كإعلان. يمكنك استخدام "أدوات مطوري البرامج في Chrome" للتحقّق من صحة المحتوى الذي تم وضع علامة عليه كإعلان. في لوحة العرض (التي يمكن الوصول إليها من خلال قائمة النقاط الثلاث ⋮ ثم مزيد من الأدوات > العرض)، اختَر تمييز إطارات الإعلان . في حال اختبار المحتوى في نافذة المستوى الأعلى أو سياق آخر لم يتم فيه تمييزه كإعلان، لن يتم بدء التدخل، ولكن سيظل بإمكانك التحقّق يدويًا من الحدود الدنيا.
يتم أيضًا عرض حالة الإعلان في اللقطة في لوحة العناصر حيث تتم إضافة تعليق توضيحي ad
بعد علامة الفتح <iframe>. يظهر هذا أيضًا في
لوحة التطبيق ضمن قسم اللقطات، حيث ستشمل اللقطات التي تمّ وضع علامة عليها للإعلان
سمة "حالة الإعلان".
استخدام الشبكة
افتح لوحة الشبكة في "أدوات مطوّري البرامج في Chrome" للاطّلاع على النشاط الإجمالي للشبكة للإعلان. ننصحك بالتأكّد من تحديد الخيار "إيقاف ذاكرة التخزين المؤقت" للحصول على نتائج متّسقة عبر عمليات التحميل المتكرّرة.
ستعرِض لك القيمة المنقولة في أسفل الصفحة المبلغ المنقول للصفحة بأكملها. ننصحك باستخدام إدخال فلتر في أعلى الصفحة لحصر الطلبات بالطلبات ذات الصلة بالإعلان فقط.
إذا عثرت على الطلب الأوّلي للإعلان، على سبيل المثال، مصدر الإطار المضمّن، يمكنك أيضًا استخدام علامة التبويب المشغِّل ضمن الطلب للاطّلاع على كل الطلبات التي يُشغِّلها.
يعد فرز القائمة العامة للطلبات حسب الحجم طريقة جيدة لتحديد الموارد الكبيرة جدًا. تشمل المخالفات الشائعة الصور والفيديوهات التي لم يتم تحسينها.
بالإضافة إلى ذلك، يمكن أن تكون طريقة الترتيب حسب الاسم طريقة جيدة لرصد الطلبات المتكررة. قد لا يكون هناك مورد واحد كبير يتسبب في التدخل، بل قد يكون هناك عدد كبير من الطلبات المتكررة التي تتجاوز الحد الأقصى بشكل تدريجي.
استخدام وحدة المعالجة المركزية (CPU)
تساعد لوحة الأداء ضِمن "أدوات مطوري البرامج" في تشخيص مشاكل استخدام وحدة المعالجة المركزية (CPU). تبدأ الخطوة الأولى بفتح قائمة إعدادات الالتقاط. استخدِم القائمة المنسدلة وحدة المعالجة المركزية (CPU) لإبطاء وحدة المعالجة المركزية قدر الإمكان. من المرجّح أن يتم تفعيل التدخلات في وحدة المعالجة المركزية على الأجهزة ذات الطاقة المنخفضة أكثر من أجهزة التطوير العالية الأداء.
بعد ذلك، انقر على الزر تسجيل لبدء تسجيل النشاط. قد تحتاج إلى تجربة متى ومدّة التسجيل، لأنّ تحميل آثار الأثر الطويل يمكن أن يستغرق بعض الوقت. بعد تحميل التسجيل، يمكنك استخدام المخطط الزمني العلوي لاختيار جزء من التسجيل. ركِّز على المناطق في الرسم البياني التي تظهر باللون الأصفر أو البنفسجي أو الأخضر والتي تمثّل النص البرمجي والعرض والتلوين.
اطّلِع على علامات التبويب من أسفل إلى أعلى وشجرة المكالمات وسجلّ الأحداث في أسفل الصفحة. يمكن أن تساعدك ترتيب هذه الأعمدة حسب الوقت المستغرَق في تنفيذ الإجراء والوقت الإجمالي في تحديد النقاط التي تؤدّي إلى إبطاء الأداء في الرمز البرمجي.
ويتم أيضًا إدراج ملف المصدر المرتبط هناك، لذا يمكنك متابعته للوصول إلى لوحة المصادر للاطّلاع على تكلفة كل سطر.
من المشاكل الشائعة التي يجب البحث عنها هنا الصور المتحركة التي تم تحسينها بشكل سيئ والتي تؤدي إلى إنشاء متواصل للتصميم والرسم البياني أو العمليات المكلفة التي يتم إخفاؤها داخل مكتبة مضمّنة.
كيفية الإبلاغ عن التدخلات غير الصحيحة
يضع Chrome علامة على المحتوى كإعلان من خلال مطابقة طلبات الموارد مع قائمة فلاتر. إذا تم وضع علامة على محتوى غير إعلاني، ننصحك بتغيير هذا الرمز لتجنّب مطابقة قواعد الفلترة. إذا كنت تشكّ في أنّه تم تطبيق تدخّل بشكلٍ غير صحيح، يمكنك إبلاغنا بالمشكلة من خلال هذا النموذج. يُرجى التأكّد من أنّك أخذت مثالاً على تقرير التدخل وأنّ لديك نموذج عنوان URL لإعادة إنتاج المشكلة.