2012-08-15 10 views
16

मेरे पास एक वेब एप्लिकेशन है जिसमें कहीं मेमोरी लीक है और मैं इसे पहचानने में असमर्थ हूं। मैंने पहले ही क्रोम डेवलपर टूल्स की कोशिश की है जो आम तौर पर बहुत अच्छा काम करता है, लेकिन मैं जिम्मेदार कोड की रेखाओं को ट्रैक करने में असमर्थ हूं। क्रोम टूल्स मुझे बहुत अधिक जानकारी देते हैं और मैं वस्तुओं को स्मृति में अपने कोड में नहीं जोड़ सकता।जावास्क्रिप्ट मेमोरी लीक को ट्रैक करने के लिए टूल

क्या कोई अन्य उपकरण उपयोगी हो सकता है?

+0

[जावास्क्रिप्ट में मेमोरी लीक डीबगिंग के लिए उपकरण] के संभावित डुप्लिकेट (http://stackoverflow.com/questions/3573252/tools-for-debugging-memory-leaks-in-javascript) –

उत्तर

22

अद्यतन: चलें रिकार्ड ढेर आवंटन प्रोफ़ाइल प्रकार का उपयोग करें।

  1. खुला DevTools प्रोफाइलर
  2. एक वार्म अप कार्रवाई कर
  3. शुरू प्रोफाइलर
  4. दोहराने कार्रवाई कई बार
  5. अगर कार्रवाई रिसाव है आप नीले रंग के समूहों में से एक ही नंबर देखेंगे सिंहावलोकन फलक
  6. में सलाखों प्रोफाइलर
  7. रोक सिंहावलोकन में इन नीले बार में से एक समूह का चयन करें
  8. वस्तुओं

स्क्रीनकास्ट Javascript Memory Leak detection (Chrome DevTools)

देखें की सूची पर गौर किया गया था: आप मेमोरी लीक fining के लिए अगले परिदृश्य का उपयोग कर सकते हैं।

  1. खुला DevTools प्रोफाइलर
  2. वह कार्रवाई है जो रिसाव
  3. एक ढेर स्नैपशॉट
  4. दोहराने चरण 2 और 3 पेड़ बार ले बनाता करना
  5. नवीनतम ढेर स्नैपशॉट
  6. परिवर्तन फ़िल्टर चुनें " स्नैपशॉट 1 और 2 के बीच ऑब्जेक्ट्स के लिए ऑब्जेक्ट "

इसके बाद आप w बीमार वस्तुओं को लीक ऑब्जेक्ट्स का एक सेट देखते हैं। आप किसी ऑब्जेक्ट का चयन कर सकते हैं और ऑब्जेक्ट के बनाए रखने वाले पेड़

+3

आप अपने कोड पर एक रिटेनर का पता कैसे लगाते हैं? – thecountofzero

+0

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

2

Detached DOM treeHeap Profiler में अपने कोड में मेमोरी में ऑब्जेक्ट मैप करने और मेमोरी लीक को ट्रैक करने के लिए तत्व के आंतरिक HTML और बाहरी HTML मानों का उपयोग करें।

+0

jQuery ajax अनुरोध थे मेरे ऐप में सबसे बड़ा अपराधी अपने सभी AJAX jQuery फ़ंक्शन खोजें: .ajax(), .get(), .post() और सामग्री सेटर्स: .html(), .text()। देव उपकरण में नेटवर्क टैब पर जाएं, वर्तमान पृष्ठ को 10 से 20 बार रीफ्रेश करें। मैंने अपने एक पेज जेएस ऐप के अंदर jQuery.load() के साथ हालिया मेमोरी रिसाव का हल किया ... 'if (! JQuery.terms_html) \t \t $ ('tc_container') लोड (STATIC_DOMAIN + '/ शर्तें। html ', function() { \t \t \t \t jQuery.terms_html = $ (' # tc_container ')। html() \t \t \t}) \t बाकी \t \t \t \t $ (' # tc_container ')। html (jQuery.terms_html) ' –

0

jQuery एजेक्स अनुरोध मेरे ऐप में सबसे बड़ा अपराधी थे। अपने सभी AJAX jQuery फ़ंक्शन खोजें: .ajax(), .get(), .post() और सामग्री सेटर्स: .html(), .text()।

देव उपकरण में नेटवर्क टैब पर जाएं, वर्तमान पृष्ठ को 10 से 20 बार रीफ्रेश करें। यदि आप चीजें अक्सर ढेर लगती हैं, या कॉल पूरी नहीं हो रही हैं, तो आपके पास मेमोरी रिसाव है।

यहां एक हालिया मेमोरी रिसाव है जिसे मैं jQuery.load() के साथ हल करने में सक्षम था ...

if(!jQuery.terms_html) $('#tc_container').load(STATIC_DOMAIN + '/terms.html', function() { jQuery.terms_html = $('#tc_container').html() }) else $('#tc_container').html(jQuery.terms_html)

इसके अलावा, इस लिखने के समय jQuery के नवीनतम संस्करण 3.3.1 है। यदि संभव हो तो शुरू करने के लिए नवीनतम संस्करण स्थापित करना सबसे अच्छा तरीका है। https://github.com/jquery/jquery/releases

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