Как ускорить рендеринг AngularJS с большими областями?

Question

Я сейчас разрабатываю угловое приложение для своей компании, но я достиг точки, где приложение стало очень медленным, поэтому я попытался настроить его, используя onetimebind везде, где я могу, отслеживать ... но быстрее загружать но все же отсталый, он состоит из довольно огромных вложенных объектов, я подсчитал общее количество объектов, он начинается с 680 и может доходить до +6000 для нормального использования приложения, о да, я должен уточнить, что приложение генерирует форму и в значительной степени + 90% объектов в области относится к входу и обновляются каждый раз, когда клик (радио) активируется/изменяется (текст) клика.

У него также есть 5/6 массивы, состоящие из объектов, и массив становится больше/меньше, приспосабливаясь к выбору клиентов, и именно там он становится лаггированным, каждый раз, когда я добавляю объект в массив, он принимает как второй для рендеринга, поэтому я попытался использовать вложенные контроллеры, думая, что если ребенок объекта обновлен, Angular будет отображать только этого ребенка, а не всех остальных, но каким-то образом приложение становится еще медленнее и laggier: s (это немного быстрее, когда я используйте ng-show вместо ng-if, но используемая память перепрыгивает с ~ 50Mb до ~ 150Mb)

Я также должен уточнить, что форма находится в стиле мастера, а не все входы отображаются сразу, номер отображаемых входов составляет от 10% до 20% от общего количества входов

Неужели кто-нибудь сталкивался с этой проблемой раньше? Кто-нибудь знает, как бороться с большими областями?

Answer 1

Грустно сказать, но это неотъемлемо от визуализации представления в угловом. Обновление в модели вызывает потенциальную перерисовку всего вида. Неважно, есть ли у вас элементы скрытые или нет. Двустороннее связывание данных действительно может убить производительность. Вы можете оценить, нужно ли визуализировать представление только один раз, в этом случае есть оптимизации, но я предполагаю, что ваша форма изменяется динамически, поэтому необходима привязка двухсторонней привязки.

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

Вы можете рассмотреть возможность использования реакции (то есть, как первая цель обратиться именно ваш случай использования)

Взгляните на этом блоге для сравнения конвейера рендеринга между угловой и реагировать Js.

http://www.williambrownstreet.net/blog/2014/04/faster-angularjs-rendering-angularjs-and-reactjs/