स्टोरेज कोटा को समझना

सभी ब्राउज़र, स्टोरेज की उस सीमा को तय करते हैं जिसका इस्तेमाल आपके वेब ऐप्लिकेशन के ऑरिजिन के लिए किया जा सकता है. रनटाइम के दौरान कैश मेमोरी में सेव किए गए डेटा को अपने-आप हटाने के लिए, Workbox को कॉन्फ़िगर किया जा सकता है. ऐसा करने से, स्टोरेज कोटा की सीमाएं खत्म होने से बचा जा सकेगा. आपकी वेबसाइट को कैश मेमोरी में सेव करने की क्षमता और उसके भरोसेमंद होने पर असर पड़ सकता है.

कॉन्फ़िगरेशन के कौनसे विकल्प काम करते हैं?

रूट और रनटाइम कैश मेमोरी की रणनीति को सेट अप करते समय, workbox-expiration से कॉन्फ़िगर किया गया ExpirationPlugin का इंस्टेंस जोड़ा जा सकता है. यह इंस्टेंस ऐसी सेटिंग के साथ कॉन्फ़िगर किया गया है जो उस तरह की एसेट के लिए सबसे सही है जिन्हें कैश मेमोरी में सेव किया जा रहा है.

उदाहरण के लिए, नीचे दिए गए कॉन्फ़िगरेशन का इस्तेमाल, रनटाइम के दौरान इमेज को कैश मेमोरी में सेव करने के लिए किया जा सकता है. इस कॉन्फ़िगरेशन का इस्तेमाल, तय सीमाओं के साथ-साथ, कोटा पार होने पर अपने-आप क्लीनअप करने के लिए किया जा सकता है:

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
      })
    ]
  })
);

ExpirationPlugin का इस्तेमाल करते समय, आपको maxEntries, maxAgeSeconds या दोनों को सेट करना होगा. purgeOnQuotaError ज़रूरी नहीं है.

maxEntries

यह किसी दिए गए कैश के लिए एंट्री (जो यूनीक यूआरएल) की संख्या पर ज़्यादा से ज़्यादा सीमा लागू करता है.

आम तौर पर, इसे सेट करना एक अच्छा आइडिया है. हालांकि, अगर आपको यह पता है कि किसी रणनीति से कभी भी, बहुत कम यूआरएल मैनेज किए जा सकते हैं, तो इसे सेट करना अच्छा रहता है.

maxAgeSeconds

इस संख्या से ज़्यादा सेकंड पहले कैश मेमोरी में जोड़ी गई एंट्री पुरानी मानी जाएंगी और अगली बार कैश मेमोरी को ऐक्सेस करने पर, वे सभी आइटम अपने-आप हट जाएंगी.

यह स्टोरेज कोटा मैनेज करने में maxEntries जितना असरदार नहीं है. ऐसा इसलिए है, क्योंकि अगर सभी एंट्री कम समय में जोड़ दी जाती हैं, तो कैश मेमोरी में ज़रूरत के हिसाब से बढ़ोतरी हो सकती है. यह तब सबसे ज़्यादा कारगर साबित होता है, जब आपको पता हो कि ऐप्लिकेशन रीफ़्रेश करने की कोई ऊपरी सीमा है, जिसे आप लागू करना चाहते हैं. साथ ही, पुरानी एंट्री रखने से आपके वेब ऐप्लिकेशन को बहुत कम फ़ायदा होता है.

purgeOnQuotaError

इस विकल्प की मदद से, कैश मेमोरी को 'सुरक्षित है' के तौर पर मार्क किया जा सकता है. ऐसा करने से, वेब ऐप्लिकेशन का स्टोरेज भर जाने पर, कैश मेमोरी अपने-आप मिट जाएगी.

फ़िलहाल, यह विकल्प डिफ़ॉल्ट रूप से false को दिखाता है. आम तौर पर, रनटाइम कैश मेमोरी में सेव किए गए डेटा को मिटाने के समय आसानी से बदला जा सकता है. इसलिए, इस विकल्प को true पर सेट करना बेहतर होता है. साथ ही, इससे यह पक्का करने में मदद मिलती है कि आपका वेब ऐप्लिकेशन, स्टोरेज कम होने पर भी अपने-आप वापस आ सके.

आपको कितना डेटा सेव करने की अनुमति है?

हर ब्राउज़र के लिए स्टोरेज की उसकी ऊपरी सीमाएं होती हैं. इसलिए, इसका कोई एक जवाब नहीं हो सकता. इसके अलावा, कुछ ब्राउज़र की डाइनैमिक सीमा होती है. यह सीमा, डिवाइस के स्टोरेज की सीमा के हिसाब से अलग-अलग होती है. इसलिए, बिना किसी सूचना के लागू होने वाली ऊपरी सीमा में बदलाव हो सकता है.

कुछ ब्राउज़र, navigator.storage.estimate() का इस्तेमाल करके, स्टोरेज की अनुमानित मात्रा के बारे में क्वेरी करने के लिए एक इंटरफ़ेस दिखाते हैं. इसमें यह भी बताया जाता है कि आपका ऑरिजिन, ज़्यादा से ज़्यादा स्टोरेज का इस्तेमाल कर रहा है या नहीं. "उपलब्ध स्टोरेज की जगह का अनुमान लगाना" लेख में, इस बारे में ज़्यादा जानकारी दी गई है कि अपने वेब ऐप्लिकेशन में इसका इस्तेमाल कैसे किया जा सकता है.

Chrome के गुप्त मोड में खास ध्यान देने वाली बातें

किसी वेब ऐप्लिकेशन को Chrome के गुप्त मोड में खोलने पर, उसके स्टोरेज पर खास पाबंदी लागू होती है. यह पाबंदी सामान्य ब्राउज़िंग कॉन्टेक्स्ट पर लागू नहीं होती: इसे इस्तेमाल करने की सीमा 100 मेगाबाइट होती है, चाहे आपके डिवाइस पर कोई भी खाली जगह क्यों न हो.

ओपेक रिस्पॉन्स से सावधान रहें!

कोटा ज़्यादा होने की एक आम वजह है, रनटाइम के दौरान ओपेक रिस्पॉन्स को कैश मेमोरी में सेव करना. इसका मतलब यह है कि सीओआरएस चालू किए बिना किए गए अनुरोधों के क्रॉस-ऑरिजिन रिस्पॉन्स.

सुरक्षा को ध्यान में रखते हुए, ब्राउज़र उन ओपेक रिस्पॉन्स के कोटा के असर को अपने-आप बढ़ा देते हैं. उदाहरण के लिए, Chrome में, कुछ किलोबाइट का ओपेक रिस्पॉन्स भी आपके कोटा इस्तेमाल में करीब 7 मेगाबाइट का योगदान देगा.

ओपेक रिस्पॉन्स को कैश मेमोरी में सेव करना शुरू करने के बाद, आप उम्मीद से ज़्यादा कोटा इस्तेमाल कर सकते हैं. इसलिए, सबसे सही तरीका यह है कि सही तरीके से कॉन्फ़िगर किए गए maxEntries और purgeOnQuotaError के साथ ExpirationPlugin का इस्तेमाल किया जाए.