واجهة برمجة التطبيقات "التخزين المؤقت للصفحات" notRestoredreasons API

التعرّف على عمليات التنقّل التي تم حظرها من استخدام ذاكرة التخزين المؤقت للصفحات الخلفية والسبب

Chris Mills
Barry Pollard

تعرض السمة notRestoredReasons، التي تمت إضافتها إلى الفئة PerformanceNavigationTiming، معلومات حول ما إذا كان قد تم حظر استخدام الإطارات المتوفّرة في المستند bfcache أثناء التنقّل، والسبب. يمكن للمطوّرين استخدام هذه المعلومات لتحديد الصفحات التي تحتاج إلى تحديثات لجعلها متوافقة مع bfcache، ما يؤدي إلى تحسين أداء الموقع الإلكتروني.

الوضع الحالي

تم طرح واجهة برمجة التطبيقات notRestoredReasons في الإصدار 123 من Chrome، ويتم طرحها تدريجيًا.

المفاهيم والاستخدام

توفّر المتصفّحات الحديثة ميزة تحسين للتنقّل في السجلّ تُعرف باسم ذاكرة التخزين المؤقت للصفحات (bfcache). ويتيح ذلك تجربة تحميل فوري عندما يعود المستخدمون إلى صفحة سبق لهم زيارتها. يمكن حظر الصفحات من الدخول إلى ذاكرة التخزين المؤقت أو إزالتها أثناء وجودها في ذاكرة التخزين المؤقت لأسباب مختلفة، بعضها مطلوب بموجب مواصفات وبعضها خاص بتنفيذ المتصفح.

في السابق، لم يكن بإمكان المطوّرين معرفة سبب حظر صفحاتهم من استخدام ذاكرة التخزين المؤقت للصفحة السابقة في الحقل، على الرغم من توفّر اختبار في أدوات مطوّري البرامج في Chrome. لتفعيل المراقبة في الحقل، تم توسيع الفئة PerformanceNavigationTiming لتشمل السمة notRestoredReasons. يعرض هذا الرمز عنصرًا يحتوي على معلومات ذات صلة بالإطار العلوي وجميع إطارات iframe المتوفّرة في المستند:

  • أسباب منعهم من استخدام ذاكرة التخزين المؤقت للخلف والأمام

  • تفاصيل مثل الإطار id وname، للمساعدة في تحديد الإطارات المضمّنة في HTML

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

أمثلة

يمكن الحصول على مثال PerformanceNavigationTiming من ميزات مثل Performance.getEntriesByType() وPerformanceObserver.

على سبيل المثال، يمكنك استدعاء الدالة التالية لعرض جميع عناصر PerformanceNavigationTiming المتوفّرة في المخطّط الزمني للأداء وتسجيل notRestoredReasons لكل منها:

function returnNRR() {
  const navEntries = performance.getEntriesByType("navigation");
  for (let i = 0; i < navEntries.length; i++) {
    console.log(`Navigation entry ${i}`);
    let navEntry = navEntries[i];
    console.log(navEntry.notRestoredReasons);
  }
}

بالنسبة إلى عمليات التنقّل في السجلّ، تعرض السمة PerformanceNavigationTiming.notRestoredReasons عنصرًا بالبنية التالية، والذي يمثّل حالة الحظر للإطار ذي المستوى الأعلى:

{
  children: [],
  id: null,
  name: null,
  reasons: [
    {"reason", "unload-listener"}
  ],
  src: null,
  url: "https://www.example.com/page/"
}

في ما يلي السمات:

children
مصفوفة من العناصر التي تمثّل حالة الحظر لأي إطارات من المصدر نفسه مضمّنة في الإطار ذي المستوى الأعلى. يتضمّن كل عنصر البنية نفسها التي يتضمّنها العنصر الرئيسي، وبهذه الطريقة، يمكن تمثيل أي عدد من مستويات الإطارات المضمّنة داخل العنصر بشكل متكرّر. إذا لم يكن للإطار عناصر فرعية، ستكون المصفوفة فارغة.
id
سلسلة نصية تمثّل قيمة السمة id للإطار (مثل <iframe id="foo" src="...">). إذا لم يكن للإطار id، ستكون القيمة null. بالنسبة إلى الصفحة ذات المستوى الأعلى، يكون هذا الرقم null.
name
سلسلة تمثّل قيمة السمة name للإطار (على سبيل المثال <iframe name="bar" src="...">). إذا لم يكن للإطار name، ستكون القيمة سلسلة فارغة. بالنسبة إلى الصفحة ذات المستوى الأعلى، يكون هذا الرقم null.
reasons
مصفوفة من السلاسل يمثّل كل منها سببًا لحظر الصفحة التي تم الانتقال إليها من استخدام ذاكرة التخزين المؤقت للخلف والأمام. هناك العديد من الأسباب المختلفة التي قد تؤدي إلى الحظر. يمكنك الاطّلاع على قسم أسباب الحظر للحصول على مزيد من التفاصيل.
src
سلسلة تمثّل مسار مصدر الإطار (على سبيل المثال <iframe src="b.html">). إذا لم يكن للإطار src، ستكون القيمة سلسلة فارغة. بالنسبة إلى الصفحة ذات المستوى الأعلى، يكون هذا الرقم null.
url
سلسلة تمثّل عنوان URL للصفحة أو الإطار المتضمّن الذي تم الانتقال إليه.

بالنسبة إلى عناصر PerformanceNavigationTiming التي لا تمثّل عمليات تنقّل في السجلّ، ستعرض السمة notRestoredReasons القيمة null.

يُرجى العِلم أنّ notRestoredReasons تعرض أيضًا null عندما لا تكون هناك أسباب للحظر، لذا فإنّ ظهور null ليس مؤشرًا على ما إذا كان قد تم استخدام ذاكرة التخزين المؤقت للخلف والأمام أم لا. لإجراء ذلك، يجب استخدام السمة event.persisted.

الإبلاغ عن حظر التخزين المؤقت للصفحات في الإطارات من المصدر نفسه

عندما تتضمّن الصفحة إطارات من المصدر نفسه، ستتضمّن القيمة المعروضة notRestoredReasons عنصرًا داخل السمة children يمثّل حالة الحظر لكل إطار مضمّن.

على سبيل المثال:

{
  children: [
    {
      children: [],
      id: "iframe-id",
      name: "iframe-name",
      reasons: [],
      src: "./index.html",
      url: "https://www.example.com/"
    },
    {
      children: [],
      id: "iframe-id2",
      name: "iframe-name2",
      reasons: [
        {"reason": "unload-listener"}
      ],
      src: "./unload-examples.html",
      url: "https://www.example.com/unload-examples.html"
    },
  ],
  id: null,
  name: null,
  reasons: [],
  src: null,
  url:"https://www.example.com"
}

الإبلاغ عن حظر bfcache في إطارات من مصادر متعددة

عندما تتضمّن الصفحة إطارات مضمّنة من مصادر متعددة، نحدّ من كمية المعلومات التي تتم مشاركتها بشأنها لتجنُّب تسريب المعلومات من مصادر متعددة. نحن نضمّن فقط المعلومات التي تعرفها الصفحة الخارجية، وما إذا كان قد تم حظر شجرة فرعية من نطاق آخر من خلال ذاكرة التخزين المؤقت للخلف والأمام أم لا. لا ندرج أي أسباب للحظر أو معلومات حول المستويات الأدنى من الشجرة الفرعية (حتى إذا كانت بعض المستويات الفرعية من المصدر نفسه).

على سبيل المثال:

{
  children: [
    {
      children: [],
      id: "iframe-id",
      name: "iframe-name",
      reasons: [],
      src: "./index.html",
      url: "https://www.example2.com/"
    }
  ],
  id: null,
  name: null,
  reasons: [
        {"reason": "masked"}
  ],
  src: null,
  url:"https://www.example.com"
}

بالنسبة إلى جميع إطارات iframe من مصادر متعددة، نسجّل القيمة null للحقل reasons الخاص بالإطار، وسيعرض الإطار ذو المستوى الأعلى السبب "masked". يُرجى العِلم أنّه قد يتم استخدام "masked" أيضًا لأسباب خاصة بعميل المستخدم، لذا قد لا يشير دائمًا إلى مشكلة في إطار iframe.

يمكنك الاطّلاع على قسم الأمان والخصوصية في الشرح للحصول على مزيد من التفاصيل حول اعتبارات الأمان والخصوصية.

أسباب الحظر

كما ذكرنا سابقًا، هناك العديد من الأسباب المختلفة التي قد تؤدي إلى الحظر:

في ما يلي أمثلة على بعض الأسباب الأكثر شيوعًا لتعذُّر استخدام ذاكرة التخزين المؤقت للخلف والأمام:

  • ‫unload-listener: تسجّل الصفحة معالج unload، ما يمنع استخدام ذاكرة التخزين المؤقت للصفحات في متصفحات معيّنة. اطّلِع على مقالة إيقاف حدث unload نهائيًا لمزيد من المعلومات.
  • ‫response-cache-control-no-store: تستخدم الصفحة no-store كقيمة cache-control.
  • related-active-contents: تم فتح الصفحة من صفحة أخرى (إما باستخدام "تكرار علامة التبويب") لا يزال لديها مرجع إلى هذه الصفحة.

الملاحظات

يريد فريق Chromium معرفة تجاربك مع واجهة برمجة التطبيقات notRestoredReasons bfcache.

أخبِرنا عن تصميم واجهة برمجة التطبيقات

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

الإبلاغ عن مشكلة في عملية التنفيذ

هل عثرت على خطأ في تنفيذ Chromium؟ أو هل يختلف التنفيذ عن المواصفات؟ يمكنك الإبلاغ عن خطأ في أداة تتبُّع المشاكل. احرص على تضمين أكبر قدر ممكن من التفاصيل، وتعليمات بسيطة لإعادة إنتاج المشكلة، وحدِّد المكوّن على أنّه UI > Browser > Navigation > BFCache.

إظهار الدعم لواجهة برمجة التطبيقات

هل تخطّط لاستخدام واجهة برمجة التطبيقات notRestoredReasons bfcache؟ يساعد دعمك العلني فريق Chromium في تحديد أولويات الميزات، ويوضّح لمورّدي المتصفّحات الآخرين مدى أهمية توفيرها.

يمكنك إرسال تغريدة إلى ‎@ChromiumDev باستخدام الهاشتاغ #NotRestoredReasons وإخبارنا بمكان استخدامك لهذه الميزة وكيفية استخدامها.

روابط مفيدة