En las aplicaciones que realizamos eventualmente tendremos manejo de datos masivos, si utilizamos los conocimientos que tenemos de Backbone.js para trabajar con colecciones, podemos ver que en algún momento nos tocará hacer modificaciones masivas y hacerlas modelo por modelo dentro de la colección no nos es efectivo.
Para sobreponernos a estos obstáculos existen formas y métodos dentro de Backbone.js con los cuales podemos modificar o refrescar y llevar a un estado anterior de todos los modelos dentro de una colección, esto es un conocimiento muy útil si tenemos que trabajar con procesos que de forma individual se nos pueda disparar el rendimiento de la aplicación.
Refrescando la Colección
Como veníamos explicando anteriormente, hacer un cambio masivo dentro de una colección es algo que puede ser útil, sobre todo cuando estamos trabajando con un volumen de datos muy amplio que puede hacer que el cambio de modelo por modelo de forma individual nos afecte el rendimiento de la aplicación.
Veamos en el siguiente ejemplo como crearemos una colección y en base a ella utilizaremos el método .reset():
Este ejemplo es bastante útil, si nos fijamos hemos iniciado una nueva colección, agregando unos 3 modelos y estamos escuchando los 3 eventos básicos el agregar, cambiar y eliminar, cada vez que ocurre alguno de estos vamos a hacer una impresión utilizando console.log(), luego que terminamos con la escucha de eventos hemos hecho un set, si hacemos el set con un modelo que no existe simplemente se agrega, pero esto es el problema que queremos evitar.
Veamos en la siguiente imagen como cumplimos con todo lo descrito al ejecutar el código en la consola para Javascript de Google Chrome:
Vemos que al hacer el reset de la colección efectivamente no se disparan los eventos declarados en un principio de eliminar modelos, ni de agregar, esto es porque estamos refrescando la colección es decir creándola como si fuese desde 0.
Con esto finalizamos el tutorial donde pudimos ver que refrescar una colección es un procedimiento muy sencillo que bien implementado puede ayudarnos a mejorar el rendimiento y la funcionalidad de nuestras aplicaciones utilizando Backbone.js.
Para sobreponernos a estos obstáculos existen formas y métodos dentro de Backbone.js con los cuales podemos modificar o refrescar y llevar a un estado anterior de todos los modelos dentro de una colección, esto es un conocimiento muy útil si tenemos que trabajar con procesos que de forma individual se nos pueda disparar el rendimiento de la aplicación.
Refrescando la Colección
Como veníamos explicando anteriormente, hacer un cambio masivo dentro de una colección es algo que puede ser útil, sobre todo cuando estamos trabajando con un volumen de datos muy amplio que puede hacer que el cambio de modelo por modelo de forma individual nos afecte el rendimiento de la aplicación.
¿Cómo hacer este cambio?
Para hacer este cambio de forma “masiva” contamos con el método .reset(), dicho método es aplicable a las colecciones, por ello primero debemos inicializar una colección antes de poder utilizarlo.
Veamos en el siguiente ejemplo como crearemos una colección y en base a ella utilizaremos el método .reset():
var TodosCollection = new Backbone.Collection();
TodosCollection.add([
{ id: 1, titulo: 'Ir a Alemania.', completado: false },
{ id: 2, titulo: 'Ir a Colombia.', completado: false },
{ id: 3, titulo: 'Ir a Japon.', completado: true }
]);
TodosCollection.on("add", function(model) {
console.log("Agregado " + model.get('titulo'));
});
TodosCollection.on("remove", function(model) {
console.log("Eliminado " + model.get('titulo'));
});
TodosCollection.on("change:completado", function(model) {
console.log("Completado " + model.get('titulo'));
});
TodosCollection.set([
{ id: 1, titulo: 'Ir a Alemania.', completado: true },
{ id: 2, titulo: 'Ir a Colombia.', completado: false },
{ id: 4, titulo: 'Ir a Hong Kong.', completado: false }
]);
TodosCollection.on("reset", function() {
console.log("Coleccion Refrescada.");
});
TodosCollection.reset([
{ titulo: 'Ir a Canada.', completado: false }
]);
Este ejemplo es bastante útil, si nos fijamos hemos iniciado una nueva colección, agregando unos 3 modelos y estamos escuchando los 3 eventos básicos el agregar, cambiar y eliminar, cada vez que ocurre alguno de estos vamos a hacer una impresión utilizando console.log(), luego que terminamos con la escucha de eventos hemos hecho un set, si hacemos el set con un modelo que no existe simplemente se agrega, pero esto es el problema que queremos evitar.
¿Cómo evitar el problema?
Para evitar el problema vamos a utilizar el método reset y para probar que funciona hemos puesto una función a escuchar si sucede el evento reset, de ser así imprimiremos un mensaje con console.log; finalmente hacemos un reset de la colección es decir refrescamos su contenido e inmediatamente definimos un nuevo modelo, al hacer esto la colección cambiara totalmente y veremos que no se deben activar los eventos anteriores que mencionamos.
Veamos en la siguiente imagen como cumplimos con todo lo descrito al ejecutar el código en la consola para Javascript de Google Chrome:
Vemos que al hacer el reset de la colección efectivamente no se disparan los eventos declarados en un principio de eliminar modelos, ni de agregar, esto es porque estamos refrescando la colección es decir creándola como si fuese desde 0.
Con esto finalizamos el tutorial donde pudimos ver que refrescar una colección es un procedimiento muy sencillo que bien implementado puede ayudarnos a mejorar el rendimiento y la funcionalidad de nuestras aplicaciones utilizando Backbone.js.
