La meilleure façon de mettre en œuvre le modèle de consommation de vote JavaScript

Question

Contexte

En mai dernier, je signalé un problème sur WebKit au sujet d'un memory retention issue. Il semble que le problème pourrait être dû à l'inspecteur Web lui-même, mais je ne suis pas encore convaincu.

Problème

Un problème refait surface dans lequel mon application JavaScript implémente un motif « Polling Consumer » pour obtenir des données qu'elle sera disponible. Le problème est que la mémoire est conservée et se développe tout au long de la journée. La logique JavaScript va comme ceci:

1. Obtenir les données et me rappeler
2. Quand je processus rappelai les données et puis passez à l'étape 1

Est-ce une façon raisonnable implémenter un consommateur d'interrogation en JavaScript? Incidemment, j'utilise la fonction ajax de jQuery qui, bien sûr, peut avoir ses propres problèmes. De plus, j'utilise un proxy jQuery comme gestionnaire de succès, donc j'aurais pensé que la rétention à travers la portée ne devrait pas être un problème. J'ai également observé le problème sans utiliser de proxy. Certains code:

FidsDataController.prototype.getFids = function() { 
    var self = this; 
    $.ajax({ 
... 
    success: function(data) { 
     // Do some processing 
     // Call back in a short while... 
     setTimeout($.proxy(self.getFids, self), 100); 
    }, 
... 
    }); 
); 

Answer 1

Vous avez une seule copie de getFids, ce qui est bon, mais chaque fois qu'il est appelé, vous créez deux nouvelles fonctions: l'un pour le gestionnaire de succès et un de l'appel $.proxy. Ces deux fonctions ne sont pas uniques par appel. Mettez-les dans des variables réutilisables et vous épargnez beaucoup de création de fonctions supplémentaires, ce qui devrait réduire considérablement votre potentiel de fuite de mémoire. Exemple où nous faisons des versions par proxy de chaque fonction une fois par objet, dans le constructeur. Exemple:

Les appels répétés ne génèrent pas plus de fonctions:

function FidsDataController() { 
    // ...constructor... 


    // Proxy these functions just once from the prototype 
    this.getFids = $.proxy(this.getFids, this); 
    this._getFids_success = $.proxy(this._getFids_success, this); 
} 

FidsDataController.prototype.getFids = function() { 
    var self = this; 
    $.ajax({ 
    success: this._getFids_success; 
    }); 
}; 

FidsDataController.prototype._getFids_success = function(data) { 
    // processing of data 
    setTimeout(this.getFids, 100); 
};