किसी तत्व की विशेषता के रूप में डेटा को स्टोर करना जोखिम भरा क्यों है?

Question

मैं एक ही बात पढ़ते रहेंगे: "। संपत्ति मूल्यों भंडारण सीधे डोम तत्वों पर वजह से संभव स्मृति लीक की जोखिम भरा है"

लेकिन क्या कोई इन जोखिमों को और विस्तार से समझा सकता है?

Answer 1

(विशेषता, मैं आप डोम तत्वों पर गुण की बात कर रहे मान।)

डोम तत्वों पर कस्टम गुण सुरक्षित हैं?

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

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

---

का उपयोग कर रहा है jQuery के .data() एक सुरक्षित विकल्प?

विशेष रूप से नहीं। JQuery के कस्टम डेटा स्टोर का उपयोग करके डेटा संग्रहीत करने के लिए मेमोरी लीक के लिए अपनी क्षमता है, और दुर्भाग्य से वे केवल पुराने ब्राउज़र को प्रभावित नहीं करते हैं।

लीक से बचने के लिए, आपको एक तत्व को नष्ट करते समय एक तत्व के .data() को साफ़ करने की आवश्यकता होगी। जब आप तत्व को नष्ट करने के लिए jQuery का उपयोग करते हैं तो यह स्वचालित होता है, लेकिन यदि आप नहीं करते हैं, तो आपके पास प्रत्येक ब्राउज़र को प्रभावित करने वाली मेमोरी लीक होगी।

---

कुछ उदाहरण दिए गए लीक पैदा कर सकता है क्या हैं?

चलो कहते हैं कि वहाँ .data() का एक समूह #foo तत्व से जुड़ा हुआ है कि करते हैं।हम jQuery तरीकों का उपयोग करते हैं तत्व दूर करने के लिए, हम सुरक्षित कर रहे हैं:

$("#foo").remove(); // associated .data() will be cleaned automatically 

लेकिन अगर हम ऐसा करते हैं, हम एक क्रॉस ब्राउज़र संगत रिसाव है:

var foo = document.getElementById("foo"); 
foo.parentNode.removeChild(foo); 

या अगर #foo वंशज कुछ अन्य तत्वों की जिनकी सामग्री jQuery के बिना साफ़ की जा रही है, यह वही समस्या होगी।

otherElement.innerHTML = ""; 

दोनों मामलों में, jQuery #foo दूर करने के लिए इस्तेमाल किया गया था नहीं, इसलिए इसकी .data() स्थायी रूप से तत्व से अलग कर रहा है, और हमारे आवेदन एक रिसाव है।

---

तो अगर मैं कभी सीधे डोम एपीआई का उपयोग, मैं सुरक्षित हूँ?

आप सुरक्षित हैं, लेकिन ऐसा एक और तरीका यह हो सकता है कि अगर हम एक से अधिक डोम मैनिपुलेशन लाइब्रेरी लोड करते हैं। विचार करें कि jQuery हमें निम्नलिखित कोड के साथ ऐसा कर में मदद करता है:

var $jq = jQuery.noConflict(); 

अब हम $prototypejs या mootools का उल्लेख करने की अनुमति दे सकते हैं, और jQuery $jq द्वारा संदर्भित है।

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

तो यदि jQuery के पास #foo पर कुछ डेटा है, और mootools उस तत्व को नष्ट करने के लिए उपयोग किया जाता है, तो हमारे पास हमारी स्मृति रिसाव है।

---

क्या होगा यदि मैं jQuery में .data() का उपयोग कभी नहीं? क्या यह मुझे सुरक्षित बनाता है?

दुख की बात है, नहीं। jQuery इवेंट हैंडलर जैसे अन्य डेटा स्टोर करने के लिए उसी .data() तंत्र का उपयोग करता है। इसलिए यदि आप किसी तत्व के साथ कुछ कस्टम डेटा को जोड़ने के लिए .data() पर कभी भी कॉल नहीं करते हैं, तो भी ऊपर दिए गए उदाहरणों के कारण आप मेमोरी लीक कर सकते हैं।

अधिकांश समय आप लीक को नहीं देख सकते हैं, लेकिन कोड की प्रकृति के आधार पर, वे अंततः एक समस्या होने के लिए काफी बड़े हो सकते हैं।

Answer 2

के अनुसार jQuery documentation:

संस्करण 9 से पहले Internet Explorer में, .prop का उपयोग कर() एक सरल आदिम मूल्य के अलावा और कुछ करने के लिए एक डोम तत्व गुण सेट करने के लिए (संख्या, स्ट्रिंग, या बूलियन) यदि स्मृति दस्तावेज़ से हटा दिया गया है, तो संपत्ति हटाई गई नहीं है (.removeProp() का उपयोग करके) हटाया गया है। स्मृति लीक के बिना डीओएम ऑब्जेक्ट्स पर मूल्यों को सुरक्षित रूप से सेट करने के लिए, .data() का उपयोग करें।