2014-04-14 10 views
8

क्रोम (नौसिखिया :))दस्तावेज़ डोम पेड़ बनाम डोम पेड़ बनाम?

मेमोरी लीकिंग कहां पहचानने के लिए मेमोरी लीक ढूंढ रहा हूं?

और दस्तावेज़ डोम पेड़ और अलग डोम पेड़ क्या है?

क्या कोई मुझे समझा सकता है?

उत्तर

20

मेमोरी लीक की पहचान करने के लिए चरण।

  1. गुप्त मोड क्रोम से प्रारंभ करें।
  2. अपने आवेदन खुला लाओ
  3. ओपन क्रोम देव उपकरण (मैं इसे खोलना चाहते पूर्ण अपने स्वयं के विंडो में बड़ा) प्रोफ़ाइल पर
  4. क्लिक करें Chrome tab - Profile
  5. उपयोग ढेर स्नैपशॉट विकल्प ले लो और क्लिक करें स्नैपशॉट
  6. Do आपके ऐप
  7. के साथ कुछ विशिष्ट चरण शीर्ष बाएं कोने पर काले वृत्त पर क्लिक करके एक और स्नैपशॉट लें। 2 बार
  8. के लिए
  9. चरण 5 दोहराएँ 7 बनाए रखा आकार की जाँच करें - अगर इसे बढ़ाने पर रहता है - आप एक स्मृति समस्या
  10. है कचरा कलेक्टर बटन पर समयसीमा टैब पर क्लिक के तहत।
  11. एक और स्नैपशॉट लें और देखें कि स्मृति उचित स्तर पर आती है या नहीं।

कदम अलग डोम पेड़ की पहचान करने के

  1. पता लगाने के लिए अलग डोम पेड़ स्नैपशॉट्स
  2. आप की बहुत देखेंगे में से एक पर प्रोफ़ाइल टैब पर क्लिक करें ऑब्जेक्ट्स - दिखाए गए अनुसार डीओएम टाइप करके उन्हें फ़िल्टर करने का प्रयास करें filtering objects DOM
  3. यदि आप कोई अलग डोम पेड़ देखते हैं तो आपको "समस्या" हो सकती है। यह संभव है कि आप जो भी कर रहे हैं, आपको क्लोनिंग आदि के लिए कुछ डीओएम को अलग रखने की आवश्यकता हो सकती है। इसलिए इसे अस्वीकार कर दिया जाना चाहिए। यदि आप इससे परे किसी भी डोम को देखते हैं तो आपको उनके बारे में चिंता करने की ज़रूरत है, खासकर यदि यह एकल पृष्ठ एप्लिकेशन है, क्योंकि अन्य ऐप्स जल्द ही पूरी चीज पुनः लोड करते हैं और यह स्मृति को साफ़ कर सकता है।
  4. आप नीचे दिखाए गए अलग डीओएम पेड़ का निरीक्षण कर सकते हैं। Detached DOM Trees

  5. यह जांचने के लिए कि क्या डोम है, आप नीचे दिखाए गए लाल HTML तत्वों पर होवर करना चाहते हैं। डिबगिंग में मदद करता है एक बार तुम डोम showing a HTMLFormElement

क्या "दस्तावेज़ डोम पेड़" कर रहे हैं स्थित? पूरा दस्तावेज़ अंदर एक बड़ा डोम ट्री है। दस्तावेज़ एक्सएमएल है और इस प्रकार टैग पेड़ बनाते हैं। (डीओएम - दस्तावेज़ ऑब्जेक्ट मॉडल।)

तो "अलग डोम पेड़" क्या हैं?

एचटीएमएल तत्व उन वस्तुओं का उदाहरण हैं जो स्मृति का उपभोग करते हैं। प्रत्येक ऐसा तत्व उन ईवेंट श्रोताओं और डेटा से जुड़े डेटा को स्टोर कर सकता है। अब "अलग डोम पेड़" कुछ भी नहीं हैं लेकिन ब्राउज़र की स्मृति में डीओएम हैं लेकिन मुख्य डोम पेड़ उर्फ ​​"दस्तावेज़ डोम पेड़" से जुड़े नहीं हैं।

इन लटकती वस्तुओं की जांच करके हम मुद्दों का पता लगा सकते हैं और मेमोरी लीक से बच सकते हैं।

इस समस्या को हल करना एक विशाल विषय है क्योंकि आप वहां कुछ अलग-अलग समाधान देख सकते हैं। कुछ लोगों ने समस्या को दूर करने के लिए क्या किया है, इसके लिए निम्नलिखित पोस्ट का पालन करें।

Can't seem to cleanup detached DOM elements

Javascript Memory Leaks: Detached DOM tree

+1

@hbhantol, विस्तृत जानकारी के लिए धन्यवाद। समय और प्रयास के लिए धन्यवाद। :) – NkS

संबंधित मुद्दे