Angular: Performance optimization / Оптимизация производительности

[nerv_]

посмотри в своем загрузчике файлов, кажется у тебя там именно такая ситуация. Т.е. если я закрою страничку загрузки файлов, то все обработчики так и останутся на $rootScope

выпилил

[Shitbox2]

Не очень понял смысл:
https://github.com/nervgh/angular-fi...ploader.js#L12
https://github.com/nervgh/angular-fi...ploader.js#L32
Где ты ушел от rootScope?)

[nerv_]

Где ты ушел от rootScope?)

здесь

[Shitbox2]

Увидел. А почему бы не брать scope из директивы? Чтобы не задавать его в контроллере всякий раз. Я бы, не зная о подвохе с rootScope, всегда бы опускал этот параметр (т.к. смысла он почти не несет) и получал бы его по-умолчанию и все связанные проблемы.

[nerv_]

Увидел. А почему бы не брать scope из директивы? Чтобы не задавать его в контроллере всякий раз. Я бы, не зная о подвохе с rootScope, всегда бы опускал этот параметр (т.к. смысла он почти не несет) и получал бы его по-умолчанию и все связанные проблемы

потому, что я при создании экземпляра загрузчика подписываюсь на события определенной области видимости
https://github.com/nervgh/angular-fi...ploader.js#L30

[nerv_]

Уже сталкивался с подобным синтаксисом

<div ng-repeat="item in array track by $index">
   ...
</div>

и в очередной раз написав это, решил открыть доку.
В доке вижу

... items to be keyed by their position in the array instead of their value

Делаю вывод: это может способствовать улучшению производительности директивы ng-repeat.

---

В довесок

For example: item in items track by item.id is a typical pattern when the items come from the database. In this case the object identity does not matter. Two objects are considered equivalent as long as their id property is same.

http://docs.angularjs.org/api/ng.directive:ngRepeat

[nerv_]

По возможности используйте

$scope.$digest(); 
// вместо
$scope.$apply();

Первый обновляет текущий и вложенные скопы, последний все приложение.

[Shitbox2]

Думаю, в 3 пункт стоит добавить, что стоит использовать throttle или debounce для scroll, mousemove, onkeyup и т.п.

$scope.$digest() можно использовать, если есть уверенность, что изменения были только в рамках текущего скопа.

[nerv_]

Думаю, в 3 пункт стоит добавить, что стоит использовать throttle или debounce для scroll, mousemove, onkeyup и т.п.

Только ты напиши, для чего это. Большинство таких слов ругачих не знают А я раскрывать секрет не стану

[STU]

Для фильтров, которые при каждом $digest'е часто возвращают одно и то же значение, полезно использовать memoize. Оно возвращает моментально значение функции, если не поменялся хэш по которому она была вычислена. Эти функции уже встроены в Underscore и Lo-Dash.
В итоге это будет выглядеть примерно так:

app.filter('tel',  [function() {
    return _.memoize(function (tel) {
	if (!tel) return '';
        tel = "("+tel.slice(0, 3)+") "+tel.slice(3, 6)+'-'+tel.slice(-4);
        return tel;
    });
}]);

По поводу вышеописанных "throttle и debounce", они так же встроены в эти библиотеки. Я просто оставлю описание с документации к Underscore:


_.throttle(function, wait) - Вернет версию функции, которая, при повторных вызовах, исполниться не чаще одного раза в заданный промежуток wait. Полезна для использования при обработке событий, которые происходят слишком часто.

var throttled = _.throttle(updatePosition, 100);
$(window).scroll(throttled);

_.debounce(function, wait) - Вернет версию функции, исполнение которой начнется не ранее, чем истечет промежуток wait, после ее последнего вызова. Полезно для реализации логики, которая зависит от завершения действий пользователя. Например, проверить орфографию комментария пользователя лучше будет после того, как он его окончательно введет, а динамически перерассчитать разметку после того, как пользователь закончит изменять размер окна.

var lazyLayout = _.debounce(calculateLayout, 300);
$(window).resize(lazyLayout);