Есть ли узоры в Угловых приложениях для сложных задач? (Помимо просто использования $ timeout с задержкой 0, чтобы позволить им выйти из стека вызовов?) Даже используя $ timeout, кажется, что пользовательский интерфейс не отвечает, когда сама обработка запускается. Должен ли я смотреть на веб-работников или что-то вроде что, или есть «Угловой способ»?AngularJS - Computation-Heavy Tasks
ответ
Поскольку JavaScript является однопоточным, вам необходимо либо выполнить вычисления на стороне сервера, либо сделать таймауты между обработкой (см. defer()
, ,,). В противном случае пользовательский интерфейс неизбежно будет заблокирован.
Я придумал способ решить мою отзывчивость по пользовательскому интерфейсу, создав специальные функции цикла, которые каждый раз через цикл используют Angular $timeout
.
app.service('responsivenessService', function($q, $timeout) {
var self = this;
// Works like Underscore's map() except it uses setTimeout between each loop iteration
// to try to keep the UI as responsive as possible
self.responsiveMap = function(collection, evalFn)
{
var deferred = $q.defer();
// Closures to track the resulting collection as it's built and the iteration index
var resultCollection = [], index = 0;
function enQueueNext() {
$timeout(function() {
// Process the element at "index"
resultCollection.push(evalFn(collection[index]));
index++;
if (index < collection.length)
enQueueNext();
else
{
// We're done; resolve the promise
deferred.resolve(resultCollection);
}
}, 0);
}
// Start off the process
enQueueNext();
return deferred.promise;
}
return self;
});
Это отображение функция возвращает обещание, которое может быть отнесено к $scope
. Использование похоже на map()
функций из Underscore или родных массивов Javascript в новых браузерах:
$scope.results = responsivenessService.responsiveMap(initialdata, function() {
// Long-running or computationally intense code here
return result;
});
код, который бы изначально заблокировал весь интерфейс теперь, кажется, работают в фоновом режиме (хотя по сути это иллюзия, как вызов приложения .DoEvents периодически в старых приложениях). Приятный и общий, если длинный код способствует работе с циклом() - стиль!
Нет углового пути. Если вы настроите таргетинг только на браузеры, которые поддерживают веб-работников, тогда они являются опцией, но нет ничего угловатого, чтобы помочь с ними. –
Спасибо! Я придумал способ решить мою отзывчивость по пользовательскому интерфейсу, создав специальные функции цикла, каждый раз использующие тайм-аут Angular $ через цикл. – blaster