nvd3 pamięci aplikacji wyciek

Question

Mam Linechart dziennym, który aktualizuje się często, patrz http://jsfiddle.net/cddw17fg/5/

function redraw() { 
    if (!redraw.isGraphShown) { 
    redraw.isGraphShown = true; 
    ... 
    } else { 
    d3.select('#chart svg') 
     .datum(data) 
     .transition().duration(1500) 
     .call(chart); 

    d3.select('.nv-x.nv-axis > g').selectAll('g').selectAll('text') 
     .attr('transform', function(d, i, j) { 
     return 'translate (-40, 40) rotate(315)' 
    }); 
    nv.tooltip.cleanup(); 
    chart.update(); 
    } 
} 

Running to JS w IE11 z „development tools” Karta „Memory Razem” wzrasta nieznacznie, ale po kilku minutach szybko się rozwija.

Po uruchomieniu jsfiddle wygląd zużycie pamięci „dobre” ... ale po kilku minutach ktoś dostaje głodny i zjada moje bajtów ...

Każdy, każdy trop o tym, co robię źle?

Answer 1

Utrzymywałem cię przez 30 minut na jednym z chromowanych zakładek, podczas gdy ja pracowałem nad czymś innym i rozbił się.

Jeśli jednak przytrzymam kartę otwartą w taki sposób, że zakładka nigdy nie straci ostrości, nigdy się nie zawiesza i działa płynnie.

W ten sposób zakładam, że nvd3 nie aktualizuje wykresu, ale zachowuje całą aktualizację w kolekcji, gdy karta jest w stanie rozmycia, dlatego pamięć rośnie. Teraz, gdy fokus powraca na zakładkę, próbuje renderować wszystkie aktualizacje, a ekran się zawiesza i ostatecznie ulega awarii.

Teraz jako Fix:

używam jQuery wykryć okno na ostrości:

$(window).focus(function() { 
    window_focus = true;//set this flag on 
}).blur(function() { 
    window_focus = false;//set this flag off as window is not in display 
}); 

Teraz wewnątrz redraw function zrobić aktualizację wykresu tylko wtedy, gdy okno jest w centrum uwagi:

if(window_focus){ 
      chart.update(); 
      d3.select('#chart svg') 
       .datum(data) 
       //.transition().duration(1500) 
       .call(chart); 

      d3.select('.nv-x.nv-axis > g').selectAll('g').selectAll('text') 
       .attr('transform', function(d, i, j) { 
        return 'translate (-40, 40) rotate(315)' 
       }); 
      nv.tooltip.cleanup(); 

     } 

Kod roboczy here

Mam nadzieję, że to pomoże!

Answer 2

Wydaje się, że jest to błąd w samym NVD3 lub D3. Moje obejście na razie polega na przeładowaniu strony ze schematem co 10 minut.

var startDateNVD3Reload = Date.now(); 
... 
var elapsed_time_minutes = (Date.now() - startDateNVD3Reload)/1000/60; 
if (elapsed_time_minutes > 10) 
{ 
    location.reload(true); 
}