2017-04-06 16 views
10

के साथ मेमोरी लीक Google Chrome में मेरा KnockoutJS v3.4.2 (परीक्षण) अनुप्रयोग चलाते समय मैं एक समस्या में भाग लेता हूं।
मेरे पृष्ठ का स्मृति उपयोग बढ़ता रहता है।नॉकआउटजेएस foreach बाध्यकारी

परीक्षण कोड कोड का एक बहुत ही सरल टुकड़ा, कि एक नमूदार सरणी में आइटम बदलता है हर दूसरा है:

HTML:

<html> 
    <head> 
     <title>KnockoutJS</title> 
    </head> 
    <body> 
     <h1>Foreach test</h1> 
     <ul id="ul-numbers" data-bind="foreach: { data: listOfItems }"> 
      <li> 
       <span data-bind="text: $data"></span> 
      </li> 
     </ul> 

     <script type="text/javascript" src="./lib/knockout.js"></script> 
     <script type="text/javascript" src="./index.js"></script> 
    </body> 
</html> 

जावास्क्रिप्ट:

var vm = { 
    listOfItems: ko.observableArray() 
}; 

window.setInterval(function updateList(){ 
    var array = []; 

    for(var i = 0 ; i < 1000; i++){ 
     var num = Math.floor(Math.random() * 500); 
     array.push(num); 
    } 

    vm.listOfItems(array); 
}, 1000); 

ko.applyBindings(vm); 

मेमोरी उपयोग:

  • Firefox में स्मृति के उपयोग में वृद्धि नहीं करता:
    शुरू: 459.6 एमबी ---> के बाद + - 1 घंटा: 279.4 एमबी

  • क्रोम में स्मृति के उपयोग रहता है बढ़ रही है (व्यक्तिगत टैब का मेमोरी):
    शुरू: 52.912 एमबी ---> के बाद + - 1 घंटा: 566.120 एमबी

  • बढ़त में स्मृति उपयोग भी बढ़ रही (व्यक्तिगत टैब का मेमोरी) रखता है:
    शुरू: 109.560 एमबी ---> के बाद + - 1 घंटा: 385.820 एमबी

मैं कुछ गलत कर रहा हूँ इस कोड स्निपेट में? या यह Google क्रोम या नॉकआउटजेएस में एक बग होगा?

+1

यदि आप 'सरणी' का उपयोग नहीं करते हैं और इसके बजाय फ़ंक्शन की शुरुआत में 'vm.listOfItems.removeAll()' को कॉल करते हैं तो 'vm.listOfItems.push (num)' लूप के अंदर (कॉल को छोड़कर अंत में 'vm.listOfItems (सरणी) '? – haim770

+0

वैकल्पिक रूप से, आप 'vm.listOfItems (array.slice (0)) को आज़मा सकते हैं;' नॉकआउट को मूल 'सरणी' के संदर्भ को संरक्षित करने से रोकने के लिए और जीसी को इसे निपटाने की अनुमति दें – haim770

+0

हटाए गए सभी के साथ परीक्षण किया गया है, लेकिन फिर भी वही व्यवहार। –

उत्तर

1

जाहिर है यह एक ब्राउज़र मुद्दा था।

जब मैं अब अपनी टेस्ट प्रोजेक्ट चलाता हूं तो स्मृति में वृद्धि नहीं होती है।
परीक्षण परियोजना यहां पाई जा सकती है: https://github.com/knockout/knockout/issues/2223

Google क्रोम संस्करण '58 .0.3029.110 'में हल किया गया।

0

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

कुछ इस तरह:

var vm = { 
    listOfItems: ko.observableArray() 
}; 

window.setInterval(function updateList(){ 
    var array = []; 
    vm.listOfItems.removeAll();//<--this is the important line 
    for(var i = 0 ; i < 1000; i++){ 
     var num = Math.floor(Math.random() * 500); 
     array.push(num); 
    } 

    vm.listOfItems(array); 
}, 1000); 

ko.applyBindings(vm); 

# 2 देखें इस पोस्ट में: https://auth0.com/blog/four-types-of-leaks-in-your-javascript-code-and-how-to-get-rid-of-them/

+0

यह समस्या को हल नहीं करता है, हमने पहले से ही कोशिश की है। (मेरे प्रश्न पर टिप्पणियां देखें) –

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