Speicherleck mit Datentabelle und Datasource mit Polling

Question

Ich habe ein DataTable, die von einem entfernten JSON bevölkerten DataSource:

var dataSource = new Y.DataSource.Get({ source: url }); 

dataSource.plug(Y.Plugin.DataSourceJSONSchema, { 
    schema: { 
     resultListLocator: "results", 
     resultFields: [ "field1", "field2" ] 
    } 
}); 

var table = new Y.DataTable({ columns = ["col1", "col2"] } 

table.plug(Y.Plugin.DataTableDataSource, { datasource: dataSource }); 

table.render("#table"); 

table.datasource.load({ request: query }); 

Ich versuche, die Daten in der Tabelle in regelmäßigen Abständen aufgefrischt zu haben. A forum poster recommended calling load periodically, die ich ausprobiert habe und es funktioniert, wie ich es mir erhofft hatte (Daten werden aktualisiert, ohne dass eine Loading ... Nachricht angezeigt wird).

Y.later(1000/*ms*/, table.datasource, table.datasource.load, { request: query }, true); 

Allerdings habe ich ein Speicherleck in Chrome festgestellt. Die Tabellenzellen scheinen nicht aus dem Speicher entfernt zu sein. Der Heap-Profiler von Chrome meldet viele HTMLTableCellElement Objekte in Detached DOM tree.

Ist dies die beste Methode zum Aktualisieren der Daten? Wenn ja, gibt es eine Möglichkeit, die alten Tabellenzellen zu löschen?

Alternativen

Es gibt auch die datatable-polling module die periodische Abrufen von Daten tun können. Ich kann jedoch keine Beispiele dafür, wie dies mit einem YUI3 DataTable verwendet werden soll. Allerdings zeigen examples from YUI2 Sie etwas folgendes tun kann, was zu funktionieren scheint:

dataSource.setInterval(1000,   
    { 
     request: query, 
     callback: 
      { 
       success: function(e) { table.onDataReturnInitializeTable }, 
       failure: function() { Y.log("Polling failure", "error"); } 
      } 
    }); 

aber es sieht aus wie das ist genau das, was load is doing under the hood anyway:

load: function(config) { 
    config = config || {}; 
    config.request = config.request || this.get("initialRequest"); 
    config.callback = config.callback || { 
     success: Y.bind(this.onDataReturnInitializeTable, this), 
     failure: Y.bind(this.onDataReturnInitializeTable, this), 
     argument: this.get("host").get("state") //TODO 
    }; 

    var ds = (config.datasource || this.get("datasource")); 
    if(ds) { 
     ds.sendRequest(config); 
    } 
}, 

Answer 1

datasource-polling werden Sie in diesem Fall nicht helfen weil Plugin.DataTableDataSource das DataTable nicht alle Änderungen in der DataSource abhören lässt. Die einfachste Art und Weise der Wahl Plugin.DataTableDataSource Verwendung wäre das Intervall sich wie folgt einzurichten:

var datasource = new Y.DataSource.IO(...); 
var table = new Y.DataTable(...); 

table.plug(Y.Plugin.DataTableDataSource, { 
    datasource: datasource 
}); 

// call load() every second 
var timer = Y.later(1000, table.datasource, 'load', { 
    request: foo 
}, true); 

// later on, stop polling 
timer.cancel(); 

Der Speicherleck Sie erwähnen, ist eine Möglichkeit. DataTable wird ständig weiterentwickelt und es wird besser, Speicher zu verwalten. Wenn Sie jedoch einen reproduzierbaren Fall und gründliche Messungen haben, sollten Sie unbedingt open an issue bei YUI GitHub Repository.