Chrome памяти/Garbage Collection Выпуск

Question

Я имею вопросы памяти/сбора мусора с Chrome

Я работаю на сайте загрузить фотографию, которая позволяет мой клиент перетащить фотографии для загрузки с использованием HTML5 и файлов API, так что это не работает в IE. он работает только в Chrome и FF. Я еще не тестировал в Safari, Opera.

Я не использую какие-либо JS-фреймворки, и мой пример составляет менее 80 строк кода, так что это действительно легко следовать.

Вот мой пример: http://seesquaredphoto.com/testPreview.html

Если перетащить несколько фотографий JPG (4-5MB каждый) в поле вы увидите нагрузку предваротельных и окна диспетчера задач, вы можете увидеть памяти использование для этого окна. Если вы нажмете кнопку «Очистить изображения», изображения будут удалены.

Если вы сделаете это в FF, через несколько секунд память вернется назад, что было до того, как вы просмотрели изображения. Однако в хром память не падает.

Любые идеи? Я делаю что-то неправильно или это хром-ошибка?

Спасибо. Вот код, если вы не хотите, чтобы просмотреть источник по ссылке выше:

Javascript:

var upload = {   
    uploadFiles : function(event) { 
     var files = event.dataTransfer.files; 
     event.stopPropagation(); 
     event.preventDefault(); 

     var imageType = /image.*/; 
     for (var x = 0; x < files.length; x++) { 
      var file = files.item(x); 
      if (!file.type.match(imageType) || file.fileName.toUpperCase().indexOf(".JPG")!=file.fileName.length-4) { 
       continue; 
      }  

      var s = document.createElement("span"); 
      s.className = "imgS"; 
      var img = document.createElement("img"); 
      img.className = "preview"; 
      img.src = ""; 

      s.appendChild(img); 
      document.getElementById("DDCont").appendChild(s); 
      loadPreview(img,file); 
     } 
    } 
}; 
function loadPreview(img,file){ 
    var reader = new FileReader(); 
    reader.onload = function(e) { 
     img.src = e.target.result; 
    } 
    reader.readAsDataURL(file) 
} 
function init(){ 
    var container = document.getElementById('DDCont'); 
    container.addEventListener("dragenter", function(event) { 
      event.stopPropagation(); 
      event.preventDefault(); 
     }, 
     false 
    ); 
    container.addEventListener("dragover", function(event) { 
      event.stopPropagation(); 
      event.preventDefault(); 
     }, 
     false 
    ); 
    container.addEventListener("dragleave", function(event) { 
      event.stopPropagation(); 
      event.preventDefault(); 
     }, 
     false 
    ); 
    container.addEventListener("drop", upload.uploadFiles, false); 
} 
function clearImages(){ 
    cont = document.getElementById("DDCont"); 
    while(cont.childNodes.length>0) { 
     cont.removeChild(cont.childNodes[0]); 
    } 
} 

HTML:

<div id="DDCont" style="width:800px; height:600px; border:3px solid #333333; overflow:auto;"></div> 
<input type="button" value="Clear Images" onclick="clearImages()"/> 

Answer 1

кажется ваше право, я верю в это происходит с любым удалением DOM, память не освобождается в Chrome. То же самое происходит и с Canvas:

http://code.google.com/p/chromium/issues/detail?id=40178

Может быть, вы можете отправить отчет об ошибке (http://crbug.com/new), и после того, как вы сделаете это, я сс соответствующей команды для получения дополнительной сортировки.

Спасибо!

Answer 2

Да, это большая проблема для меня,
Кажется, что современные браузеры не освобождают ресурсы, особенно с изображениями. Я думаю, что это должно быть фокусом, учитывая огромное количество страниц Ajax, сохраняя состояние и позволяя пользователю НЕ обновлять страницу.

К счастью, с HTML5 видео, вы можете достичь этого, первых изменений СРКА

video.src=" "; 
video.load(); 

Если вы сделаете это, прежде чем снимать видео элементов, память очищается.

К сожалению, я не нашел способ сделать это с помощью изображений, если он найден, я хотел бы узнать.

Answer 3

По-видимому, это исправлено в последних версиях хрома (по крайней мере, утечка видеопамяти).

Исправление можно найти в хроме 49, и я считаю, что это было точно совершить что установил его: https://chromium.googlesource.com/chromium/src/+/d13710832e9d0e6302cf8388cda94a7a780d8664%5E%21/#F0

Это означает, что источник хак больше не нужен.