Большое количество небольших запросов по сравнению с небольшим количеством больших запросов - Angularjs SPA?

Question

У меня есть сложная приборная панель, которую я хотел бы обновлять каждую минуту. Это приложение Angularjs SPA с бэкэнд IIS, работающим в Azure.

На приборной панели показано приблизительно 30-40 виджетов dashlet. Каждому виджету требуется примерно 10 коллекций объектов данных. Каждая коллекция получает около 3-5 новых точек данных каждую минуту

Я хочу обеспечить, вторичные, потому что я предпочел бы добавить больше веб-серверов, чем скорость sacrafice и интерактивности браузера)

• Должен ли я обновить всю панель сразу? (1 очень большой звонок, вероятно, загрузит 1200-1600 единиц данных ... вероятно, намного больше для некоторых пользователей, и намного меньше для других). Это ставит большую нагрузку на веб-серверы и менее масштабируется с точки зрения веб-сервера. Но я не уверен, что такое браузер.

• Обновите один виджет dashlet за раз? (30-40 коротких звонков, каждый из которых возвращает около 40 единиц информации)

• Обновление каждой коллекции объектов данных внутри панели приборов индивидуально? (Около 300-400 крошечных звонков, каждый из которых возвращают ~ 3-5 единиц информации)

Можно предположить, что общее время сервера для сбора данных для 1 большого обновления и для 300-400 отдельных точек данных очень похож ,

Своевременность обновлений не является/супер/важна ... если некоторые виджеты обновляются через 10 секунд и некоторые вовремя, это нормально. Responsivness браузера и веб-сайт имеет важное значение в целом, так что если пользователь решает взаимодействовать с dashlets, вещь должна быть очень гибкой

Цените любой совет

Answer 1

AngularJS оптимизаций все о:

1. Обеспечение быстрой оценки привязки выражения.
2. Минимизируйте количество наблюдаемых вещей.
3. Минимизируйте количество циклов дайджеста: фаза, когда угловая проверка изменений модели производится путем сравнения старых и новых значений модели.

Но прежде чем вы начнете исправлять \ оптимизировать любую из вышеперечисленных частей, важно понять, как работает привязка угловых данных и какие циклы дайджеста. Это SO post должно помочь вам в этом отношении.

Возвращаясь к возможной оптимизации.

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

Во-вторых, минимальное количество часов.Это требует, чтобы вы проанализируете свой вид связывание поведения:

• Существует ли части, которые когда-то связанный не изменится: Используйте bindonce direcitive или если вы находитесь на угловых 1.3, сам Угловом поддерживают один раз связывание с использованием :: синтаксиса в выражении.
• Создайте элементы DOM только для видимых в представлении вещей: использование ng-if или ng-switch, а не ng-show \ ng-hide может помочь. Посмотрите, как работает ngInfiniteScroll.

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

Каждый удаленный вызов также приводит к полному циклу дайджеста, поэтому помощь в удаленных вызовах будет полезной. Есть несколько дополнительных возможностей оптимизации, если вы используете scope.$digest вместо scope.$apply. scope.$apply запускает большой цикл дайджеста приложения, тогда как scope.$digest запускает только дочерние области. Чтобы действительно оптимизировать цикл взгляд дайджеста на Building Huuuuuge Apps with AngularJS от Брайана Форда

Но прежде, чем что-либо измерить, как вещи работают, используя такие инструменты, как Batarang и убедитесь, что такая оптимизация не требуется.