🧑🏽 ⭕️ 👩🏾‍🚒 जेएस कैसे काम करता है: भंडारण 🧑🏿‍🤝‍🧑🏾 🎬 👩‍🏭

वेब एप्लिकेशन को डिजाइन करते समय, स्थानीय डेटा भंडारण के लिए सही उपकरण चुनना बेहद जरूरी है। हम एक ऐसे तंत्र के बारे में बात कर रहे हैं, जो आपको सूचनाओं को स्टोर करने की अनुमति देगा, सर्वर और क्लाइंट के क्लाइंट के बीच ट्रांसफर किए गए डेटा की मात्रा को कम करने में मदद करेगा, और साथ ही यह उपयोगकर्ता के एक्सपोज़र के लिए एप्लिकेशन की प्रतिक्रिया की गति को भी खराब नहीं करेगा। स्थानीय डेटा कैशिंग के लिए एक सुविचारित रणनीति मोबाइल वेब अनुप्रयोगों के विकास के लिए केंद्रीय है जो बिना इंटरनेट कनेक्शन के काम कर सकती है। आधुनिक उपयोगकर्ता तेजी से ऐसे अवसरों का उल्लेख कर रहे हैं, जो कुछ परिचित और अपेक्षित हैं।

आज, जावास्क्रिप्ट से संबंधित सब कुछ के लिए समर्पित सामग्री की एक श्रृंखला के भाग 16 के अनुवाद में, हम क्लाइंट-साइड डेटा स्टोरेज तंत्रों के बारे में बात करेंगे जो वेब विकास में उपयोग किए जा सकते हैं, और एक विशिष्ट परियोजना के लिए डेटा स्टोरेज सिस्टम चुनने के बारे में।

[पढ़ने की सलाह] चक्र के अन्य 19 भागों

भाग 1: इंजन का अवलोकन, रनटाइम मैकेनिज्म, कॉल स्टैक
भाग 2: वी 8 इंटर्नल्स और कोड ऑप्टिमाइज़ेशन के बारे में
भाग 3: स्मृति का प्रबंधन करना, चार प्रकार की मेमोरी लीक करना और उनसे निपटना
भाग 4: इवेंट लूप, Async, और पाँच तरीके Async / प्रतीक्षा के साथ अपने कोड को बेहतर बनाने के लिए
भाग 5: WebSocket और HTTP / 2 + SSE। क्या चुनना है?
भाग ६: वेबसर्विस की विशेषताएं और कार्यक्षेत्र
भाग 7: वेब श्रमिक और पाँच उपयोग परिदृश्य
भाग 8: सेवा कर्मी
भाग 9: वेब पुश सूचनाएँ
भाग 10: MutationObserver के साथ DOM में ट्रैक परिवर्तन
भाग 11: वेब पेज रेंडरिंग इंजन और उनके प्रदर्शन के अनुकूलन के लिए सुझाव
भाग 12: ब्राउज़र का नेटवर्क सबसिस्टम, इसके प्रदर्शन और सुरक्षा को अनुकूलित करता है
भाग 12: ब्राउज़र का नेटवर्क सबसिस्टम, इसके प्रदर्शन और सुरक्षा को अनुकूलित करता है
भाग 13: सीएसएस और जावास्क्रिप्ट के साथ एनीमेशन
भाग 14: जेएस कैसे काम करता है: सार सिंटैक्स पेड़, पार्सिंग और इसका अनुकूलन
भाग 15: जेएस कैसे काम करता है: कक्षाएं और विरासत, बेबल और टाइपस्क्रिप्ट में ट्रांसप्लिकेशन
भाग 16: जेएस कैसे काम करता है: भंडारण
भाग 17: जेएस कैसे काम करता है: शैडो डोम टेक्नोलॉजी और वेब कंपोनेंट्स
भाग 18: जेएस कैसे काम करता है: वेबआरटीसी और पी 2 पी संचार तंत्र
भाग 19: जेएस कैसे काम करता है: कस्टम तत्व

डेटा मॉडल

एक डेटा मॉडल संग्रहीत डेटा के आंतरिक संगठन को परिभाषित करता है। यह वेब एप्लिकेशन डिवाइस के सभी पहलुओं को प्रभावित करता है, इसमें समाधान शामिल होते हैं, अक्सर समझौता करते हैं, जिस पर आवेदन की प्रभावशीलता और इसके कार्यों को हल करने के लिए भंडारण प्रणाली की क्षमता निर्भर करती है। डेटा मॉडल डिजाइन करने के लिए कोई "सर्वश्रेष्ठ" दृष्टिकोण नहीं है, कोई सार्वभौमिक समाधान नहीं हैं जो सभी अनुप्रयोगों के लिए उपयुक्त हैं। डेटा मॉडल का विकल्प किसी विशेष एप्लिकेशन की सुविधाओं और जरूरतों पर आधारित है। कई बुनियादी डेटा भंडारण मॉडल पर विचार करें जिससे आप किसी विशेष परियोजना के लिए उपयुक्त कुछ चुन सकते हैं।

एक संरचित डेटा स्टोरेज मॉडल। इस मॉडल का उपयोग करते समय, डेटा को पूर्वनिर्धारित फ़ील्ड के साथ तालिकाओं में संग्रहीत किया जाता है। यह दृष्टिकोण SQL- आधारित डेटाबेस प्रबंधन प्रणालियों के लिए विशिष्ट है। ऐसी प्रणालियों को प्रश्नों का उपयोग करके उनके साथ काम करने के लिए अच्छी तरह से अनुकूलित किया गया है। एक संरचित ब्राउज़र डेटा वेयरहाउस का एक प्रसिद्ध उदाहरण IndexedDB है (हालांकि यह एक NoSQL DBMS है)।
कुंजी / मान भंडारण मॉडल। कुंजी / मान जोड़े के रूप में आयोजित डेटा के लिए वेयरहाउस, और उनके साथ जुड़े NoSQL DBMS, डेवलपर को असंरचित डेटा को स्टोर करने और अपनी अनूठी कुंजियों द्वारा स्टोर से इसे पुनः प्राप्त करने की क्षमता देते हैं। इस तरह के स्टोरेज इस अर्थ में हैश टेबल के समान हैं कि वे आपको अपारदर्शी प्रकारों के अनुक्रमित डेटा तक पहुंच व्यवस्थित करने की अनुमति देते हैं। मूल्यों की कुंजी / मूल्य भंडारण का एक अच्छा उदाहरण ब्राउज़र में कैश एपीआई और अपाचे कैसेंड्रा सर्वर-साइड डीबीएमएस है।
बाइट्स के अनुक्रम में डेटा संग्रहीत करने के लिए एक मॉडल। इस सरल मॉडल का उपयोग करके, डेटा को चर लंबाई के बाइट्स के अनुक्रम के रूप में संग्रहीत किया जाता है। इस डेटा के आंतरिक संगठन का कार्य पूरी तरह से आवेदन स्तर पर हल किया गया है। इस मॉडल का उपयोग फाइल सिस्टम और क्लाउड स्टोरेज सिस्टम जैसे अन्य पदानुक्रमित डेटा वेयरहाउस में किया जाता है।

ब्राउज़र को उपलब्ध डेटा के लगातार भंडारण के लिए तरीके

इस तरह के डेटा के लगातार भंडारण समय के संदर्भ में वेब एप्लिकेशन में उपयोग की जाने वाली भंडारण विधियों का विश्लेषण किया जा सकता है।

सत्र के भीतर डेटा भंडारण। इस श्रेणी का डेटा केवल तब तक संग्रहीत किया जाता है जब तक कि एक विशिष्ट वेब सत्र मौजूद है या ब्राउज़र टैब सक्रिय है। सत्र डेटा संग्रहीत करने के लिए तंत्र का एक उदाहरण SessionStorage API है।
सत्र जीवनकाल के संदर्भ के बिना डिवाइस पर डेटा का भंडारण। यह डेटा एक विशिष्ट डिवाइस पर और सत्रों के बीच में संग्रहीत किया जाता है, उदाहरण के लिए, जब आप वेब एप्लिकेशन पेज के साथ ब्राउज़र टैब को बंद करते हैं, तो इसे हटाया नहीं जाता है। उपकरणों पर वेब एप्लिकेशन डेटा संग्रहीत करने के लिए तंत्र का एक उदाहरण कैशे एपीआई है।
वैश्विक भंडारण का उपयोग कर स्थायी डेटा भंडारण। इस दृष्टिकोण में डेटा संग्रहीत करना शामिल है जो सत्रों के बीच खो नहीं जाता है और किसी विशिष्ट डिवाइस से बंधा नहीं है। इस तरह के डेटा को उपयोगकर्ताओं द्वारा विभिन्न उपकरणों के बीच साझा किया जा सकता है। नतीजतन, यह डेटा स्टोर करने का सबसे विश्वसनीय और दीर्घकालिक तरीका है। इस तरह के डेटा को डिवाइस पर ही संग्रहीत नहीं किया जा सकता है, जिसका अर्थ है कि इस तरह की डेटा स्टोरेज स्कीम को व्यवस्थित करने के लिए किसी प्रकार के सर्वर स्टोरेज का उपयोग किया जाना चाहिए। हम इसमें नहीं जाएंगे, क्योंकि हमारा मुख्य कार्य यह विचार करना है कि उपकरणों पर वेब एप्लिकेशन डेटा कैसे संग्रहीत किया जाए।

क्लाइंट साइड स्टोरेज असेसमेंट

आज, कई ब्राउज़र एपीआई हैं जो आपको डेटा भंडारण को व्यवस्थित करने की अनुमति देते हैं। हम उनमें से कुछ को देखेंगे और सही एपीआई चुनने के लिए आपकी तुलना आसान बनाने के लिए उनकी तुलना करेंगे।

हालाँकि, शुरू करने के लिए, हमें कुछ सामान्य मुद्दों पर ध्यान देना चाहिए, जो डेटा संग्रहीत करने के लिए एक विशिष्ट तकनीक चुनने से पहले ध्यान में रखा जाना चाहिए। बेशक, सबसे पहले, आपको यह समझने की आवश्यकता है कि आपके आवेदन का उपयोग कैसे किया जाएगा, इसका समर्थन कैसे आयोजित किया जाएगा, और इसे कैसे विकसित करने की योजना है। उसी समय, भले ही आपके पास इन सवालों के स्पष्ट उत्तर हों, आप अंत में डेटा स्टोरेज सिस्टम के लिए कई विकल्पों पर जा सकते हैं, जिसमें से आपको सबसे उपयुक्त चुनने की आवश्यकता होगी। भंडारण प्रणाली चुनते समय आपको यहां ध्यान देना चाहिए:

ब्राउज़र का समर्थन। यह ध्यान में रखा जाना चाहिए कि मानकीकृत, विकसित एपीआई को प्राथमिकता देना सबसे अच्छा है। वे, सबसे पहले, एक लंबी उम्र रखते हैं, और दूसरी बात, वे कई ब्राउज़रों द्वारा समर्थित हैं। इसी तरह के एपीआई, इसके अलावा, आमतौर पर अच्छे दस्तावेज और एक सक्रिय डेवलपर समुदाय होते हैं।
लेन-देन का समर्थन। कभी-कभी यह महत्वपूर्ण होता है कि जब रिपॉजिटरी के साथ काम करते हैं, तो संबंधित संचालन के सेटों में परमाणु संपत्ति होगी, अर्थात, संचालन के सेट का निष्पादन या तो सफल होगा यदि सभी ऑपरेशन सफल रहे, या यदि उनमें से कम से कम एक असफल रहा, तो यह विफल हो जाएगा। डेटाबेस परंपरागत रूप से इस सुविधा का समर्थन करते हैं जो एक लेनदेन मॉडल का उपयोग करके संबंधित डेटा अपडेट को मनमाने ब्लॉकों में समूह में करने के लिए किया जा सकता है।
तुल्यकालिक या अतुल्यकालिक ऑपरेशन। कुछ डेटा संग्रहण API समकालिक होते हैं, इस अर्थ में कि ऐसे API से डेटा को सहेजने या लोड करने का कार्य सक्रिय थ्रेड को तब तक रोकते हैं जब तक कि संबंधित अनुरोध पूरा न हो जाए। तुल्यकालिक एपीआई का उपयोग करने से मुख्य थ्रेड को अवरुद्ध किया जा सकता है, जिसके परिणामस्वरूप उपयोगकर्ता इंटरफ़ेस का "ब्रेक" हो सकता है। इसलिए, यदि संभव हो तो, अतुल्यकालिक एपीआई का उपयोग करने का प्रयास करें।

भंडारण तुलना

इस खंड में, हम वेब डेवलपर्स के लिए उपलब्ध कुछ मौजूदा भंडारण प्रणालियों को देखेंगे और ऊपर वर्णित संकेतकों के अनुसार उनकी तुलना करेंगे।

^{एपीआई}	^{डेटा मॉडल}	^{भंडारण पद्धति}	^{ब्राउज़र का समर्थन}	^{लेन-देन का समर्थन}	^{तुल्यकालिक या अतुल्यकालिक}
^{फाइल सिस्टम}	^{बाइट क्रम}	^{युक्ति}	^52%	^नहीं	^{अतुल्यकालिक}
^LocalStorage	^{कुंजी / मूल्य}	^{युक्ति}	^93%	^नहीं	^{सिंक्रनाइज़}
^{SessionStorage}	^{कुंजी / मूल्य}	^सत्र	^93%	^नहीं	^{सिंक्रनाइज़}
^कुकी	^{संरचित डेटा}	^{युक्ति}	^100%	^नहीं	^{सिंक्रनाइज़}
^कैश	^{कुंजी / मूल्य}	^{युक्ति}	^60%	^नहीं	^{अतुल्यकालिक}
^IndexedDB	^{हाइब्रिड मॉडल}	^{युक्ति}	^83%	^हां	^{अतुल्यकालिक}

अब डेटा स्टोरेज के इन तरीकों के बारे में अधिक बात करते हैं।

एपीआई फाइलसिस्टम

FileSystem एपीआई के उपयोग के माध्यम से, वेब एप्लिकेशन उपयोगकर्ता के स्थानीय फ़ाइल सिस्टम के चयनित क्षेत्र के साथ काम कर सकते हैं। एप्लिकेशन स्टोरेज की सामग्री को देख सकता है, फाइलें बना सकता है, पढ़ने और लिखने का संचालन कर सकता है।

इस API में निम्नलिखित मुख्य भाग होते हैं:

फ़ाइलों और पठन फ़ाइलों के प्रबंधन के लिए तंत्र: File/Blob , FileList , FileReader
फ़ाइलें बनाने और उन्हें डेटा लिखने के लिए तंत्र: Blob , FileWriterFileWriter
निर्देशिका और फ़ाइल सिस्टम के साथ काम करने के लिए तंत्र: DirectoryReader , FileEntry / DirectoryEntry , LocalFileSystem

FileSystem API मानक नहीं है, इसलिए इसे उत्पादन में उपयोग नहीं किया जाना चाहिए, क्योंकि यह सभी उपयोगकर्ताओं के लिए काम नहीं करेगा। इस एपीआई के विभिन्न कार्यान्वयन बहुत भिन्न हो सकते हैं, और यह बहुत संभावना है कि यह भविष्य में बदल सकता है।

इस एपीआई के filesystem इंटरफ़ेस का उपयोग फाइल सिस्टम को दर्शाने के लिए किया जाता है। फ़ाइल सिस्टम के माध्यम से संबंधित वस्तुओं तक पहुंच प्राप्त की जा सकती है। कुछ ब्राउज़र फ़ाइल सिस्टम बनाने और प्रबंधित करने के लिए अतिरिक्त API प्रदान करते हैं।

यह इंटरफ़ेस वेब पेज को उपयोगकर्ता की फ़ाइल प्रणाली तक पहुँच नहीं देता है। इसके बजाय, यह आपको वर्चुअल डिस्क जैसी किसी चीज़ के साथ काम करने की अनुमति देता है, जो ब्राउज़र द्वारा बनाए गए सैंडबॉक्स में स्थित है। यदि आपके एप्लिकेशन को उपयोगकर्ता की फ़ाइल प्रणाली तक पहुंच की आवश्यकता है, तो आपको अन्य तंत्रों का उपयोग करने की आवश्यकता होगी।

एक वेब एप्लिकेशन window.requestFileSystem() कॉल करके वर्चुअल फाइल सिस्टम तक पहुंच का अनुरोध कर सकता है।

 // :    Google Chrome 12: window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem; window.requestFileSystem(type, size, successCallback, opt_errorCallback)

यदि आप पहली बार requestFileSystem() कहते हैं, तो आपके आवेदन के लिए एक नया भंडार बनाया जाएगा। यह याद रखना महत्वपूर्ण है कि यह एक अलग भंडारण है, अर्थात, एक वेब अनुप्रयोग किसी अन्य अनुप्रयोग द्वारा बनाए गए भंडारण के साथ काम नहीं कर सकता है।

फ़ाइल सिस्टम तक पहुँच प्राप्त करने के बाद, आप फ़ाइलों और निर्देशिकाओं के साथ अधिकांश मानक कार्य कर सकते हैं।

FileSystem एपीआई वेब अनुप्रयोगों द्वारा उपयोग की जाने वाली अन्य समान प्रणालियों से गंभीर रूप से भिन्न है, क्योंकि इसका उद्देश्य ग्राहक पर डेटा भंडारण कार्यों को हल करना है, जो डेटाबेस टूल द्वारा बहुत अच्छी तरह से हल नहीं किए जाते हैं। सामान्य तौर पर, ये ऐसे एप्लिकेशन होते हैं जो बाइनरी डेटा के बड़े टुकड़े के साथ काम करते हैं, या ब्राउज़र के बाहरी अनुप्रयोगों के साथ डेटा का आदान-प्रदान करते हैं।

FileSystem API का उपयोग करने के विकल्पों में निम्नलिखित हैं:

डेटा अपलोड सिस्टम। जब कोई उपयोगकर्ता किसी सर्वर पर अपलोड की जाने वाली फ़ाइल या फ़ोल्डर का चयन करता है, तो यह डेटा एक स्थानीय आइसोलेटेड स्टोरेज में कॉपी किया जाता है, और फिर, भागों में, सर्वर को भेजा जाता है।
एप्लीकेशन जो बड़ी मात्रा में मल्टीमीडिया डेटा को संभालते हैं - गेम, म्यूजिक प्लेयर।
ध्वनि और छवि संपादन अनुप्रयोग जो इंटरनेट कनेक्शन के बिना काम करते हैं या काम को गति देने के लिए एक बड़े स्थानीय कैश का उपयोग करते हैं। इस तरह के अनुप्रयोगों के साथ काम करने वाले डेटा बाइट्स का एक क्रम है जो काफी बड़ा हो सकता है। इस तरह के डेटा के भंडारण के लिए इसे लिखने और पढ़ने की क्षमता का समर्थन करना चाहिए।
ऑफ़लाइन वीडियो प्लेयर। ऐसे कार्यक्रमों को बड़ी फ़ाइलों को डाउनलोड करने की आवश्यकता होती है जिन्हें इंटरनेट कनेक्शन के बिना देखा जा सकता है। डेटा को स्ट्रीमिंग करते समय, और फ़ाइल के चारों ओर घूमने के लिए सुविधाजनक प्रणाली को व्यवस्थित करने के लिए यह आवश्यक हो सकता है।
ऑफ़लाइन ईमेल क्लाइंट। ऐसे प्रोग्राम ईमेल से जुड़ी फाइलों को डाउनलोड कर सकते हैं और उन्हें स्थानीय रूप से सहेज सकते हैं।

यह कैसे ब्राउज़र FileSystem एपीआई का समर्थन करता है।

ब्राउज़रों द्वारा फ़ाइलसिस्टम एपीआई के लिए समर्थन

लोकलस्टोरेज एपीआई

LocalStorage API, या स्थानीय संग्रहण, आपको दस्तावेज़ ऑब्जेक्ट के संग्रहण ऑब्जेक्ट के साथ काम करने की अनुमति देता है, उसी स्रोत के सिद्धांत को ध्यान में रखते हुए। सत्रों के बीच डेटा नष्ट नहीं होता है। LocalStorage एपीआई LocalStorage एपीआई, सेशन स्टोरेज के समान है, अंतर यह है कि सेशन स्टोरेज में डेटा पेज सेशन खत्म होने के बाद डिलीट हो जाता है, और लोकल स्टोरेज में डेटा स्थायी रूप से स्टोर हो जाता है।

कृपया ध्यान दें कि स्थानीय या सत्र भंडारण में स्थित डेटा पृष्ठ स्रोत से जुड़ा है, जो प्रोटोकॉल, होस्ट और पोर्ट के संयोजन से निर्धारित होता है।
यहां विभिन्न ब्राउज़रों के लिए LocalStorage ब्राउज़र LocalStorage समर्थन जानकारी दी गई है।

ब्राउज़रों द्वारा लोकलस्टोरेज एपीआई का समर्थन

SessionStorage एपीआई

SessionStorage API आपको संग्रहण सत्र ऑब्जेक्ट के साथ काम करने की अनुमति देता है। SessionStorage API LocalStorage API के समान है LocalStorage बारे में हमने ऊपर बात की थी। उनके बीच अंतर, जैसा कि पहले ही उल्लेख किया गया है, डेटा संग्रहण समय में है, अर्थात्, SessionStorage के मामले में SessionStorage डेटा तब तक संग्रहीत किया जाता है जब तक सत्र चलता रहता है। यह तब तक रहता है जब तक कि ब्राउज़र ओपन नहीं होता है, जबकि पेज के रीलोड होने के बाद भी यह बना रहता है। एक नया टैब या विंडो में एक पेज खोलना एक नया सत्र शुरू करेगा, यह सत्र कुकीज़ के व्यवहार से अलग है। उसी समय, SessionStorage साथ काम करते समय, और LocalStorage साथ, किसी को यह याद रखना चाहिए कि इस तरह के स्टोरेज का डेटा पेज स्रोत से जुड़ा हुआ है।

यहाँ SessionStorage API के लिए कुछ ब्राउज़र समर्थन हैं:

ब्राउज़र सत्रस्टोर एपीआई समर्थन

कुकी एपीआई

कुकीज़ (कुकीज़, वेब कुकीज़, ब्राउज़र कुकीज़) जानकारी के छोटे टुकड़े हैं जो सर्वर ब्राउज़र को भेजता है। ब्राउज़र उन्हें सहेज सकता है और उन्हें सर्वर पर भेज सकता है, इसका उपयोग करते हुए उन्हें अनुरोध करता है। वे आमतौर पर एक विशिष्ट ब्राउज़र उदाहरण की पहचान करने के लिए उपयोग किए जाते हैं, जिनसे अनुरोध भेजे जा रहे हैं। उदाहरण के लिए, ताकि उपयोगकर्ता सिस्टम में प्रवेश करने के बाद, उसमें बने रहे। एक कुकी HTTP प्रोटोकॉल के लिए एक तरह का सेशन स्टेट इंफॉर्मेशन स्टोरेज सिस्टम है, जो हर रिक्वेस्ट का इलाज करता है, यहां तक कि उसी ब्राउजर से भी आता है, जो पूरी तरह से दूसरों से स्वतंत्र है।

कुकीज़ का उपयोग तीन मुख्य कार्यों को हल करने के लिए किया जाता है:

सत्र प्रबंधन। कुकीज़ का उपयोग तंत्र पर आधारित है जैसे कि प्रवेश प्रणाली से लेकर वेब एप्लिकेशन, ऑनलाइन स्टोर में खरीदारी की टोकरी, ब्राउज़र गेम्स में अर्जित अंकों का भंडारण। यह सब कुछ संग्रहीत करने के बारे में है जो उपयोगकर्ता को इसके साथ काम करते समय सर्वर को जानना होगा।
निजीकरण। कुकीज़ का उपयोग उपयोगकर्ता की वरीयताओं के बारे में डेटा संग्रहीत करने के लिए किया जाता है, उन विषयों के बारे में जो वह साइट को डिजाइन करने के लिए चुनता है, और इसी तरह की अन्य चीजों के बारे में।
उपयोगकर्ता की निगरानी। कुकीज़ उपयोगकर्ता व्यवहार का रिकॉर्ड और विश्लेषण करती हैं।

एक समय में, कुकीज़ को एक सामान्य-उद्देश्य डेटा वेयरहाउस के रूप में उपयोग किया जाता था। यद्यपि यह कुकीज़ का उपयोग करने के लिए एक पूरी तरह से सामान्य तरीका है, खासकर जब वे एक ग्राहक पर डेटा स्टोर करने का एकमात्र तरीका थे, तो उन्हें हमारे समय में इस तरह के रूप में उपयोग करने की अनुशंसा नहीं की जाती है, अधिक आधुनिक एपीआई पसंद करते हैं। कुकीज़ हर अनुरोध के साथ भेजे जाते हैं, इसलिए वे प्रदर्शन को ख़राब कर सकते हैं (विशेषकर मोबाइल उपकरणों पर)।

कुकीज़ दो प्रकार की होती हैं:

सत्र कुकीज़। उन्हें सत्र के बाद हटा दिया जाता है। वेब ब्राउज़र सत्र पुनर्प्राप्ति तकनीक का उपयोग कर सकते हैं, जिसके कारण सत्र कुकीज़ के बहुमत स्थायी रूप से संग्रहीत होते हैं, सत्र के परिणामस्वरूप वे ब्राउज़र को बंद करने और पुनरारंभ करने और संबंधित पृष्ठ खोलने के बाद भी सहेजे जाते हैं।
स्थायी कुकीज़। लगातार कुकीज़ सत्र के बाद प्रासंगिकता नहीं खोते हैं। उनके पास एक निश्चित भंडारण अवधि होती है, जो या तो एक निश्चित तिथि ( Expires विशेषता) या एक निश्चित अवधि ( Max-Age विशेषता) द्वारा निर्धारित की जाती है।

कृपया ध्यान दें कि गोपनीय या अन्य महत्वपूर्ण जानकारी कुकीज़ में संग्रहीत नहीं की जानी चाहिए या HTTP कुकीज़ में संचारित नहीं होनी चाहिए, क्योंकि कुकीज़ के साथ काम करने का पूरा तंत्र स्वाभाविक रूप से असुरक्षित है।

यदि हम कुकीज़ के समर्थन के बारे में बात करते हैं, तो, जैसा कि आप शायद पहले से ही समझ चुके हैं, सभी ब्राउज़र उनका समर्थन करते हैं।

कैश एपीआई

कैश इंटरफ़ेस अनुरोध / रिस्पांस ऑब्जेक्ट्स के कैश्ड जोड़े के लिए एक डेटा स्टोरेज तंत्र प्रदान करता है। इस इंटरफ़ेस को सेवा कर्मियों के रूप में एक ही विशिष्टताओं में परिभाषित किया गया है, लेकिन यह न केवल श्रमिकों के लिए सुलभ है। Cache इंटरफ़ेस window ऑब्जेक्ट के दायरे में भी उपलब्ध है, यह केवल सेवा कर्मियों के साथ उपयोग करने के लिए आवश्यक नहीं है।

एक निश्चित स्रोत में Cache ऑब्जेक्ट्स के कई नाम हो सकते हैं। डेवलपर को लागू करने के लिए जिम्मेदार है कि कैसे उसकी स्क्रिप्ट (उदाहरण के लिए, एक सेवा कार्यकर्ता में ) कैश को अद्यतित रखती है। कैश में संग्रहीत आइटम तब तक अपडेट नहीं किए जाते हैं जब तक कि उन्हें अपडेट करने का स्पष्ट अनुरोध नहीं किया जाता है, उनकी भंडारण अवधि समाप्त नहीं होती है, वे केवल कैश से हटाए जा सकते हैं। नामित कैश ऑब्जेक्ट को खोलने के लिए, आप CacheStorage.open () कमांड का उपयोग कर सकते हैं, जिसके बाद आप कैश प्रबंधन आदेशों को एक्सेस कर सकते हैं।

इसके अलावा, डेवलपर कैश को समय-समय पर साफ़ करने के लिए ज़िम्मेदार होता है। प्रत्येक ब्राउज़र में कैश के आकार पर एक हार्ड-कोडित सीमा होती है जो एक विशिष्ट स्रोत को आवंटित की जाती है। अनुमानित कैश कोटा का पता लगाने के लिए आप StorageEstimate API का उपयोग कर सकते हैं।

उपलब्ध कैश स्थान की एक निश्चित मात्रा को बनाए रखने के लिए ब्राउज़र अपनी शक्ति में सब कुछ करता है, लेकिन यह कुछ स्रोत के लिए कैश को हटा सकता है। आमतौर पर, ब्राउज़र या तो पूरे कैश को हटा देता है, या इसे बिल्कुल चिंता नहीं करता है। कैश का उपयोग करते समय, उन्हें अपनी स्क्रिप्ट के संस्करणों के अनुसार अंतर करना न भूलें, उदाहरण के लिए, कैश नाम में स्क्रिप्ट के संस्करण सहित। यह कैश के साथ स्क्रिप्ट के विभिन्न संस्करणों के सुरक्षित संचालन को सुनिश्चित करने के लिए किया जाता है। विवरण यहाँ पाया जा सकता है ।

CacheStorage इंटरफ़ेस कैश ऑब्जेक्ट्स के लिए संग्रहण प्रदान करता है। यहां ऐसे कार्य हैं जिनके लिए यह इंटरफ़ेस जिम्मेदार है:

सभी नामित कैश की एक सूची प्रदान करना जो एक सेवा कार्यकर्ता के साथ काम कर सकता है, या किसी अन्य प्रकार के कार्यकर्ता। आप विंडो ऑब्जेक्ट के माध्यम से कैश के साथ भी काम कर सकते हैं।
स्ट्रिंग नामों और टाइप Cache की संबंधित वस्तुओं के बीच मानचित्रण का समर्थन करता है।

Cache ऑब्जेक्ट का एक उदाहरण प्राप्त करने के लिए, CacheStorage.open () कमांड का उपयोग करें।

यह पता लगाने के लिए कि क्या कोई विशेष अनुरोध ऑब्जेक्ट CacheStorage द्वारा प्रबंधित किसी Cache ऑब्जेक्ट की कुंजी है, CacheStorage.match () विधि का उपयोग करें।

CacheStorage वैश्विक कैश प्रॉपर्टी के माध्यम से एक्सेस कर सकते हैं।

एपीआई IndexedDB

IndexedDB API एक DBMS है जो आपको ब्राउज़र का उपयोग करके डेटा स्टोर करने की अनुमति देता है। चूंकि यह आपको उन वेब एप्लिकेशन बनाने की अनुमति देता है जिनमें इंटरनेट कनेक्शन के बिना भी जटिल डेटा सेट के साथ काम करने की क्षमता होती है, ऐसे एप्लिकेशन सर्वर से कनेक्शन के बिना और बिना समान रूप से अच्छा महसूस कर सकते हैं। IndexedDB का उपयोग उन अनुप्रयोगों में किया जाता है, जिन्हें बड़ी मात्रा में डेटा संग्रहीत करने की आवश्यकता होती है (उदाहरण के लिए, ऐसा एप्लिकेशन किसी निश्चित किराये की सेवा की मूवी कैटलॉग की तरह हो सकता है), और जिसे सामान्य ऑपरेशन के लिए नेटवर्क के लिए निरंतर कनेक्शन बनाए रखने की आवश्यकता नहीं है (उदाहरण के लिए, ये ईमेल क्लाइंट हैं) , कार्य प्रबंधकों, नोटबुक, और इतने पर)।

यहां हम IndexedDB को अन्य क्लाइंट डेटा स्टोरेज तकनीकों की तुलना में थोड़ा अधिक ध्यान देंगे, क्योंकि, एक तरफ, अन्य एपीआई अधिक व्यापक रूप से ज्ञात हैं, और दूसरी तरफ, चूंकि IndexedDB DBMS वेब अनुप्रयोगों की बढ़ती बढ़ती लोकप्रियता के कारण अधिक से अधिक लोकप्रिय हो रहा है। ।

▍ आंतरिक तंत्र IndexedDB

IndexedDB एपीआई आपको डेटाबेस में "कुंजी" का उपयोग करके ऑब्जेक्ट डेटा को बचाने और इससे पढ़ने की अनुमति देता है। डेटाबेस में किए गए सभी परिवर्तन लेनदेन में होते हैं। ऐसे अधिकांश समाधानों की तरह, IndexedDB एकल स्रोत नीति का अनुसरण करता है। नतीजतन, एक एप्लिकेशन केवल अपने डोमेन से संबंधित डेटा तक पहुंच सकता है, लेकिन अन्य डोमेन से डेटा नहीं।

IndexedDB एक अतुल्यकालिक एपीआई है जिसका उपयोग वेब श्रमिकों सहित अधिकांश संदर्भों में किया जा सकता है। पहले, इस एपीआई का एक तुल्यकालिक संस्करण वेब श्रमिकों के लिए भी था, लेकिन यह इस तथ्य के कारण विनिर्देश से हटा दिया गया था कि यह वेब डेवलपर्स के लिए विशेष रूप से दिलचस्प नहीं था।

IndexedDB पास WebSQL डेटाबेस के चेहरे में एक प्रतियोगी था, लेकिन कई साल पहले W3C द्वारा इस मानक पर काम बंद कर दिया गया था। जबकि IndexedDB और WebSQL क्लाइंट पर डेटा संग्रहीत करने के लिए समाधान हैं, उनकी कार्यक्षमता अलग है। WebSQL एक संबंधपरक DBMS है, और IndexedDB अनुक्रमित तालिकाओं पर आधारित एक प्रणाली है।

अन्य DBMS के साथ अनुभव से सीखे गए विचारों के आधार पर आपको IndexedDB के साथ काम करना शुरू नहीं करना चाहिए। इसके बजाय, इस डेटाबेस के लिए प्रलेखन को सावधानीपूर्वक पढ़ना उपयोगी होगा और उन तरीकों का उपयोग करना होगा जिनके साथ इसे काम करने के लिए डिज़ाइन किया गया है। यहाँ IndexedDB की मूल अवधारणाओं का संक्षिप्त विवरण दिया गया है:

IndexedDB डेटाबेस डेटा को कुंजी / मान प्रारूप में संग्रहीत करता है। मान जटिल संरचित वस्तुएं हो सकते हैं, और कुंजी ऐसी वस्तुओं के गुण हो सकते हैं। ऑब्जेक्ट की किसी भी संपत्ति के आधार पर इंडेक्स बनाए जा सकते हैं, जो डेटा की खोज को तेज कर सकते हैं और उनकी छँटाई को आसान बना सकते हैं। कीज़ भी बाइनरी ऑब्जेक्ट हैं।
IndexedDB DBMS एक ट्रांसेक्शनल मॉडल के आधार पर बनाया गया है। डेटाबेस के साथ किए गए सभी ऑपरेशन हमेशा लेनदेन के संदर्भ में होते हैं। परिणामस्वरूप, उदाहरण के लिए, आप लेनदेन के बाहर कमांड निष्पादित नहीं कर सकते हैं या कर्सर को खोल नहीं सकते हैं। इसके अलावा, लेनदेन स्वचालित रूप से पुष्टि की जाती है; उन्हें मैन्युअल रूप से पुष्टि नहीं की जा सकती है।
इंडेक्सडीडीबी एपीआई, अधिकांश भाग के लिए, अतुल्यकालिक है। यह एपीआई अनुरोधित डेटा प्रदान नहीं करता है, बस इसे कुछ कमांड के जवाब में वापस कर देता है। इसके बजाय, डेटा का अनुरोध करते समय, आपको संबंधित पद्धति पर कॉलबैक फ़ंक्शन को पास करना होगा। डेटाबेस के लिए डेटा को बचाने या इसे लोड करने के लिए सिंक्रोनस दृष्टिकोण का उपयोग नहीं किया जाता है। इसके बजाय, एप्लिकेशन आवश्यक कार्रवाई का वर्णन करते हुए एक डेटाबेस क्वेरी बनाता है। ऑपरेशन पूरा होने के बाद, एक घटना होती है जो उस एप्लिकेशन को सूचित करती है कि ऑपरेशन पूरा हुआ या नहीं। यह दृष्टिकोण XMLHttpRequest API, या कई अन्य जावास्क्रिप्ट तंत्रों से विशेष रूप से भिन्न नहीं है।
IndexedDB बहुत सारे प्रश्नों का उपयोग करता है। अनुरोध वे ऑब्जेक्ट होते हैं जो किसी ऑपरेशन की सफलता या विफलता के बारे में घटनाओं को प्राप्त करते हैं। उनके पास onsuccess और onerror गुण हैं, जिससे आप संबंधित घटनाओं के लिए श्रोताओं को असाइन कर सकते हैं, साथ ही साथ तैयार, result , errorCode , जिसका विश्लेषण करके आप अनुरोध की स्थिति के बारे में पता लगा सकते हैं।
IndexedDB एक ऑब्जेक्ट ओरिएंटेड डेटाबेस है। यह एक संबंधपरक डीबीएमएस नहीं है जिसकी तालिकाएं पंक्तियों और स्तंभों का संग्रह हैं। यह मौलिक सुविधा प्रभावित करती है कि आप IndexedDB का उपयोग करके कैसे डिज़ाइन और निर्माण करते हैं।
IndexedDB SQL का उपयोग नहीं करता है। यह DBMS इंडेक्स क्वैश्चंस लागू करता है जो शापर्स को लौटाते हैं जो डेटासेट के साथ काम करने के लिए उपयोग किए जाते हैं जो क्वेरी परिणाम हैं। यदि आप NoSQL सिस्टम से परिचित नहीं हैं, तो इस सामग्री पर एक नज़र डालें।
IndexedDB स्टोरेज एकल स्रोत नीति लागू करते हैं। एक स्रोत डोमेन, प्रोटोकॉल और दस्तावेज़ के पोर्ट URL का एक संयोजन है जिसमें स्क्रिप्ट निष्पादित होती है। प्रत्येक स्रोत केवल डेटाबेस के अपने सेट के साथ काम कर सकता है, जबकि प्रत्येक डेटाबेस में एक अद्वितीय नाम होता है जो एक स्रोत के डेटाबेस के भीतर इसकी पहचान करता है।

IndexedDB की सीमाएं

IndexedDB प्रणाली को इस अपेक्षा के साथ डिज़ाइन किया गया है कि ग्राहक की अधिकांश डेटा संग्रहण कार्यों को हल करने के लिए इसकी क्षमताएं पर्याप्त होनी चाहिए। यह स्पष्ट है कि यह किसी भी उपयोग के मामले के लिए उपयुक्त एक सार्वभौमिक प्रणाली नहीं है। यहाँ कुछ स्थितियाँ हैं जिनके लिए इसे डिज़ाइन नहीं किया गया है:

विभिन्न भाषाओं की विशेषताओं के अनुसार डेटा को क्रमबद्ध करना। सभी भाषाओं में नहीं, तार एक ही तरह से सॉर्ट किए जाते हैं, और IndexedDB विभिन्न भाषाओं की विशेषताओं के आधार पर सॉर्टिंग का समर्थन नहीं करता है। एक ही समय में, हालांकि डेटाबेस इस तरह की छँटाई नहीं कर सकता है, डेटाबेस से प्राप्त जानकारी को आवेदन द्वारा क्रमबद्ध किया जा सकता है।
तुल्यकालन। एपीआई को सर्वर के साथ स्थानीय डेटाबेस को सिंक्रनाइज़ करने की संभावना को ध्यान में रखते हुए डिज़ाइन नहीं किया गया था। इस तरह के सिंक्रनाइज़ेशन, निश्चित रूप से संभव है, लेकिन डेवलपर को स्वतंत्र रूप से उपयुक्त तंत्र को लागू करना होगा।
पूर्ण पाठ खोज। IndexedDB API SQL से LIKE स्टेटमेंट की तरह कुछ का समर्थन नहीं करता है।

इसके अलावा, IndexedDB के साथ काम करते समय, ध्यान रखें कि ब्राउज़र निम्नलिखित मामलों में डेटाबेस को हटा सकता है:

उपयोगकर्ता ने डेटा को हटाने के लिए एक कमांड दी। कई ब्राउज़रों में सेटिंग्स सेक्शन होते हैं जिनमें ऐसे उपकरण होते हैं जो उपयोगकर्ता को वेबसाइट के लिए संग्रहीत सभी डेटा को हटाने की अनुमति देते हैं, जिसमें कुकीज़, बुकमार्क, सहेजे गए पासवर्ड और IndexedDB डेटा शामिल हैं।
ब्राउज़र अनाम मोड में काम करता है। इस तरह के मोड को अलग-अलग ब्राउज़र में अलग-अलग तरीके से कहा जाता है। क्रोम में यह "गुप्त मोड" है, फ़ायरफ़ॉक्स में यह "निजी मोड" है। अनाम सत्र समाप्त होने के बाद, ब्राउज़र डेटाबेस को हटा देगा।
डिस्क अतिप्रवाह या पूर्व निर्धारित सीमा तक पहुंचना।
डेटा भ्रष्टाचार।

सामान्य तौर पर, यह ध्यान दिया जा सकता है कि ब्राउज़र डेवलपर इंडेक्सडीडीबी डेटाबेस को हटाने का प्रयास नहीं करते हैं जब तक कि बिल्कुल आवश्यक न हो।

यहाँ विभिन्न ब्राउज़रों में IndexedDB समर्थन के बारे में जानकारी दी गई है।

विभिन्न ब्राउज़रों द्वारा IndexedDB के लिए समर्थन

स्टोरेज सिस्टम चुनना

जैसा कि पहले ही उल्लेख किया गया है, आवेदन की आवश्यकताओं को देखते हुए, उन स्टोरेज सिस्टम को चुनना सबसे अच्छा है, जिनके पास व्यापक ब्राउज़र समर्थन और अतुल्यकालिक मोड में काम करना है, जो उपयोगकर्ता इंटरफ़ेस पर उनके प्रभाव को कम करता है। ये मानदंड स्वाभाविक रूप से निम्नलिखित तकनीकों तक ले जाते हैं:

जानकारी के ऑफ़लाइन संग्रहण के लिए Cache API का उपयोग करें। यह किसी भी ब्राउज़र में उपलब्ध है जो सेवा कर्मचारियों का समर्थन करता है, जो उन वेब अनुप्रयोगों को बनाने के लिए आवश्यक हैं जो बिना इंटरनेट कनेक्शन के काम कर सकते हैं। कैश एपीआई एक पेज से जुड़े कुछ संसाधनों को संग्रहीत करने के लिए एक आदर्श विकल्प है।
एप्लिकेशन की स्थिति या उपयोगकर्ताओं द्वारा बनाई गई कुछ जानकारी को संग्रहीत करने के लिए, IndexedDB का उपयोग करें। यह तकनीक, कैशिंग के साथ तुलना में, अधिक ब्राउज़रों का समर्थन करती है, जो कि इंडेक्सेडबीडी पर आधारित अनुप्रयोगों के उपयोगकर्ताओं की क्षमता को ऑफ़लाइन काम करने के लिए विस्तारित करती है।

परिणाम

, SessionStack API . , , - , . , , , - .

प्रिय पाठकों! -?

जेएस कैसे काम करता है: भंडारण