Carga diferida en Knockout JS

Question

Estoy intentando cargar y analizar datos json de una fuente externa en una tabla mediante Knockout JS. Hasta ahora, todo ha sido un éxito a través del siguiente código:

// Snippet 
    var self = this; 
    self.notices = ko.observableArray([]); 
    self.currentTab = ko.observable(5); 
    ko.computed(function() { 
     $.getJSON('http://json.source.here.com/tab/'+ko.toJS(self.currentTab), function(threads) { 
      if (threads !== null) { 
       self.notices(threads); 
      } else { 
       self.notices([]); 
      } 
     }); 
    }, self.notices); 

Cuando un usuario hace clic en una determinada pestaña sería cargar los datos JSON (hilos del foro) en función del valor pestaña seleccionada (self.currentTab) en el tabla en forma de filas (self.notices).

Todo funciona como se esperaba, sin embargo, me di cuenta mientras navegaba por otras páginas que no tienen los enlaces anteriores, el json todavía se está cargando ($ .getJSON está activado). Me preocupa que esto pueda tener algunos efectos perjudiciales en el rendimiento de mi sitio web, ya que está cargando la fuente JSON aunque no sea necesaria.

EDIT: me di cuenta de esto a través de la consola de desarrollador de Google Chrome.

Actualmente tengo mi modelo de vista en un archivo JavaScript que también está siendo utilizado por todas las demás páginas. Consiste en enlaces para todas las páginas.

Mi pregunta es, ¿cómo puedo cargar los datos json en una página específica o solo cuando los enlaces están presentes - carga lenta? Preferiblemente, me gustaría mantener todos los enlaces en un solo archivo de JavaScript, no quiero separarlos y cargarlos por página.

Answer 1

Aquí es un artículo que escribí sobre un tema simliar un poco de tiempo atrás: http://www.knockmeout.net/2011/06/lazy-loading-observable-in-knockoutjs.html

En su caso, creo que realmente desea agregar algunos guardias alrededor de la llamada $.getJSON para asegurar que sólo está haciendo AJAX solicita cuando se encuentra en el estado apropiado (en la pestaña correspondiente).

Junto con eso, la publicación de blog describe el uso de la bandera deferEvaluation en un observable calculado para asegurar que la lógica no se ejecute hasta que alguien se una contra la observable calculada (en su caso, usted tiene un observable calculado anónimo, pero podría agréguela a su modelo de vista como una propiedad y úsela en su vista. Sin este indicador, el código de evaluación se ejecutará cuando cree el observable calculado, lo cual no es deseable en su caso.