التعرّف على حصة مساحة التخزين

تفرض جميع المتصفّحات حدًا أقصى على مقدار مساحة التخزين التي يُسمح لمصدر تطبيق الويب باستخدامها. يمكنك ضبط Workbox لتنظيف البيانات التي يخزّنها مؤقتًا في وقت التشغيل تلقائيًا لتجنّب تجاوز حدود حصة مساحة التخزين التي قد تؤثّر في كفاءة التخزين المؤقت وموثوقية موقعك الإلكتروني.

ما هي خيارات الضبط المتاحة؟

عند إعداد استراتيجية التخزين المؤقت للمسار ووقت التشغيل، يمكنك إضافة مثيل لـ ExpirationPlugin من workbox-expiration تم ضبطه باستخدام الإعدادات الأكثر ملاءمةً لنوع مواد العرض التي تحتفظ بها في ذاكرة التخزين المؤقت.

على سبيل المثال، يمكن استخدام الضبط التالي للتخزين المؤقت للصور في وقت التشغيل، مع تطبيق حدود صريحة على الاستخدام بالإضافة إلى التنظيف التلقائي في حال تجاوز الحصة:

import {registerRoute} from 'workbox-routing';
import {CacheFirst} from 'workbox-strategies';
import {ExpirationPlugin} from 'workbox-expiration';

registerRoute(
  ({request}) => request.destination === 'image',
  // Use a cache-first strategy with the following config:
  new CacheFirst({
    // You need to provide a cache name when using expiration.
    cacheName: 'images',
    plugins: [
      new ExpirationPlugin({
        // Keep at most 50 entries.
        maxEntries: 50,
        // Don't keep any entries for more than 30 days.
        maxAgeSeconds: 30 * 24 * 60 * 60,
        // Automatically cleanup if quota is exceeded.
        purgeOnQuotaError: true
      })
    ]
  })
);

يجب ضبط maxEntries أو maxAgeSeconds أو كليهما عند استخدام ExpirationPlugin. إنّ السمة purgeOnQuotaError اختيارية.

maxEntries

وهذا يضع حدًا أقصى لعدد الإدخالات (أي عناوين URL الفريدة) لذاكرة تخزين مؤقت معينة.

وعادةً ما يكون ضبط ذلك فكرة جيدة، إلا إذا كنت على علم بأنّ هناك عددًا قليلاً فقط من عناوين URL المحتملة التي يمكن معالجتها من خلال استراتيجية معيّنة.

maxAgeSeconds

سيتم اعتبار الإدخالات التي تمت إضافتها إلى ذاكرة التخزين المؤقت قبل أكثر من هذا العدد من الثواني قديمة، وسيتم تنظيفها تلقائيًا في المرة التالية التي يتم فيها الوصول إلى ذاكرة التخزين المؤقت.

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

purgeOnQuotaError

يتيح لك هذا الخيار وضع علامة على ذاكرة تخزين مؤقت معيّنة كآمن لكي يتم حذفها تلقائيًا في حال تجاوز تطبيق الويب مساحة التخزين المتاحة.

في الوقت الحالي، يتم استخدام false تلقائيًا. بوجه عام، من المفترض أن تكون ذاكرات التخزين المؤقت أثناء التشغيل مرنة قبل الحذف، لذا، يُعدّ ضبط هذا الخيار على true ممارسة جيدة ويساعد في ضمان إمكانية استرداد تطبيق الويب تلقائيًا لمواجهة قيود مساحة التخزين.

ما هو مقدار البيانات التي يُسمح لك بتخزينها؟

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

تعرض بعض المتصفّحات واجهة لطلب معلومات عن المقدار التقريبي لمساحة التخزين التي يستخدمها المصدر، بالإضافة إلى الحد الأقصى، من خلال navigator.storage.estimate(). تحتوي مقالة "تقدير مساحة التخزين المتاحة" على مزيد من المعلومات حول كيفية استخدام مساحة التخزين هذه في تطبيقات الويب الخاصة بك.

اعتبارات خاصة بشأن التصفُّح المتخفي في Chrome

يؤدي فتح تطبيق ويب في وضع التصفُّح المتخفي في Chrome إلى فرض قيود خاصة على سعة التخزين لا تنطبق على سياقات التصفُّح العادية: هناك حد أقصى للحصة يبلغ حوالي 100 ميغابايت، بغض النظر عن المساحة المتوفّرة على جهازك.

انتبِه من الردود المبتسمة.

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

وتعمل المتصفّحات تلقائيًا على تضخيم تأثير الحصة لهذه الاستجابات الغامضة كاعتبارات أمنية. في Chrome على سبيل المثال، حتى استجابة مبهمة بمبلغ قليل من الكيلوبايت، ستساهم بحوالي 7 ميغابايت في استخدام حصتك.

يمكنك بسرعة استهلاك حصة أكبر بكثير مما كنت تتوقعه عند بدء التخزين المؤقت للردود الغامضة، لذا فإن أفضل ممارسة هي استخدام ExpirationPlugin مع maxEntries وربما purgeOnQuotaError، مع ضبطها بشكل مناسب.