किसी छवि ऑब्जेक्ट को डिस्प्ले करें

Question

जावास्क्रिप्ट में एक नया छवि तत्व बनाते समय, Google क्रोम का मेमोरी टूल (डेवलपर टूल> टाइमलाइन> मेमोरी) इसे स्वाभाविक रूप से एक नए डोम तत्व के रूप में मानता है।

मेरे मामले में, मैं 1500+ डोम तत्वों के साथ समाप्त हो रहा हूं, और मैं उनसे छुटकारा पाना चाहता हूं।

Uncaught TypeError: Cannot call method 'removeChild' of null

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

var images = []; 
var i, image; 

for(i = 0; i < urls.length; i++) { 
    image = new Image(); 
    image.src = urls[i]; 
} 

// other stuff happens 

for(i = 0; i < images.length; i++) { 
    // apparently this doesn't work because I'm not adding the image to my DOM 
    // images[i].parentNode.removeChild(images[i]); 

    // delete images 
} 

वहाँ दूर करने के लिए/हटाने/सेट किए बिना एक रास्ता है/छवि वस्तुओं निपटान?

Answer 1

स्थापना images = null वस्तु के लिए कोड में आपके संदर्भ को दूर करेंगे। हालांकि, load ईवेंट को लागू करने के लिए, क्रोम को ऑब्जेक्ट का अपना आंतरिक संदर्भ होना चाहिए।

है यही कारण है कि आप इस तरह कोड हो सकता है:

for(i = 0; i < urls.length; i++) { 
    image = new Image(); 
    image.src = urls[i]; 
    image.onload = function(){alert('Test');}; 
    image = null; 
} 

इस तरह से आप अभी भी "टेस्ट" अलर्ट का एक बहुत मिलता है, भले ही आप इन वस्तुओं के लिए एक संदर्भ की जरूरत नहीं है।

इसलिए, मेरे अनुमान यह है कि यह क्रोम में एक बग है, न कि आपके कोड में।

अद्यतन: क्रोमियम स्रोत के माध्यम से देख एक तरह से साबित होता है कि (मैं इस फ़ाइल की तर्ज 67-71 पर टिप्पणी, विशेष रूप से FIXME टिप्पणी http://code.google.com/searchframe#OAMlx_jo-ck/src/third_party/WebKit/Source/WebCore/bindings/v8/custom/V8HTMLImageElementConstructor.cpp मतलब):

// Make sure the document is added to the DOM Node map. Otherwise, the HTMLImageElement instance 
// may end up being the only node in the map and get garbage-ccollected prematurely. 
// FIXME: The correct way to do this would be to make HTMLImageElement derive from 
// ActiveDOMObject and use its interface to keep its wrapper alive. Then we would 
// remove this code and the special case in isObservableThroughDOM. 

Answer 2

यदि आप उन्हें डोम में नहीं जोड़ रहे हैं (जैसे appendChild माता-पिता को उपयोग करना), तो removeChild बेकार है। छवि वस्तुएं केवल स्मृति में हैं।

और स्मृति में वस्तुओं को निपटाने के लिए, आपको केवल इन ऑब्जेक्ट्स के संदर्भों को हटाने की आवश्यकता है (जैसे रेफरेंसिंग वेरिएबल को शून्य पर सेट करें), और कचरा संग्रह शेष करेगा। यदि आप उन्हें सभी को कम नहीं कर सकते हैं, तो वे जीसीएड नहीं होंगे।

Answer 3

मुझे लगता है कि एक ही रास्ता यह करने के लिए है:

for(i = 0; i < images.length; i++) 
    images[i] = null; 
} 

// or just 
images = null; 

Answer 4

AFAIK, बताए null यह साफ करना चाहिए: images[i] = null

Answer 5

बग वर्णित से छुटकारा पाने के क्रोम और specilly आईई और EDGE के "naivists" द्वारा। आप छवि स्रोत को खाली में बदल सकते हैं ताकि यह शून्य स्मृति ले सके।

image.src = ''; 
image = null;