Лучшие практики для очистки фабрик по изменению состояния в AngularJS (1.x) - PullRequest
Новая
       13

Лучшие практики для очистки фабрик по изменению состояния в AngularJS (1.x)

0 голосов
/ 20 ноября 2018

У меня очень большое приложение, которое запрашивает огромные объемы данных (как требование) по десяткам проектов.Каждый проект отслеживает разные данные из других проектов, и каждый имеет свое собственное родительское состояние / разрешение (используя ui-router).Я могу поддерживать низкое использование данных на одной странице с помощью различных приемов, но мне интересно, что является лучшим и наиболее эффективным методом очистки данных о переходе состояний в фабричных синглетах, которые больше не нужны ?

По сути, мне нужно, чтобы все другие синглеты, не используемые текущим состоянием, опустели при переходе состояния, чтобы браузер не переполнялся из-за размера данных.

Как обойти,В настоящее время я передаю данные через все свои фабрики, а не храню их непосредственно на исходной фабрике.Вместо этого я решаю проблему с помощью своего рода шаблона фасада, который запрашивает данные с отдельных фабрик определения данных и направляет все разрешенные данные в единую глобальную фабрику хранения для использования с помощью директив представления, например, так.

angular.module('someModule', [])
.config(function($stateProvider){
   $stateProvider
   .state('state1', {
      resolve: {state1Data: function(facadeFactory){return facadeFactory.setState1()}}
   })
   .state('state2', {
      resolve: {state2Data: function(facadeFactory){return facadeFactory.setState2()}}
   });
})
.factory('facadeFactory', function facadeFactory($q, singleStorageFactory, dataSource1, dataSource2, dataSource3, dataSource4){
   var factory = {};
   factory.setState1 = function(){
      var dfd = $q.defer();
      dataSource1.getAllData()
      .then(function(result){ return dataSource2.getAllData(result);})
      .then(function(result){ return singleStorageFactory.setData(result);})
      .then(function(){dfd.resolve(true);});
      return dfd.promise;
   }

   factory.setState2 = function(){
      var dfd = $q.defer();
      dataSource3.getAllData()
      .then(function(result){ return dataSource4.getAllData(result);})
      .then(function(result){ return singleStorageFactory.setData(result);})
      .then(function(){dfd.resolve(true);});
      return dfd.promise;
   }
   return factory;
})
.factory('dataSource1', function dataSource1(){
   var factory = {};
   factory.dataDef = {
      name: "list1",
      cols: ['col1','col2','col3'],
      thisKey: 'col1'
   };
   factory.getAllData = function(currentData){
      // get data > add it to currentData if it exists > return aggregated data
   };
   return factory;
})
// dataSource2, dataSource3, and dataSource4 are same as dataSource1 albeit with different data definition
.factory('singleStorageFactory', function singleStorageFactory($q){
     var factory = {};
     factory.data;
     factory.setData = function(data){
          var dfd = $q.defer();
          factory.data = data;
          dfd.resolve(factory.data);
          return dfd.promise;
     };
     return factory;
});

Я храню отдельные определения данных на их собственных фабриках из-за некоторых других требований, связанных с объединением частей и частей данных по проектам в своего рода мастер-трекер, но это ни здесь, ни там.

Итог, это правильный способ предотвратить сбой браузера при сбое больших наборов данных или я упускаю что-то очевидное о том, как AngularJS собирает мусор из неиспользуемых синглетонов?

1 Ответ

0 голосов
/ 11 декабря 2018

Мы рассмотрели это в моем офисе и не смогли найти какой-либо верный способ сохранения данных, особенно когда они большие.

В результате мы обновляли страницу каждые 5-10 минут, в то время какэто не 100% живые данные, это работает для нас. 

$timeout(reload, 300000);// don't forget to inject $timeout in your controller

reload(){
$route.reload(); // don't forget to inject $route in your controller
}
...