Ng-повторить с помощью ng-скрыть ИЛИ выполнить задание в контроллере для повышения производительности?

#javascript #angularjs #performance #angularjs-ng-repeat

#javascript #angularjs #Производительность #angularjs-ng-repeat

Вопрос:

Вопрос простой, но я уверен, что он обеспечивает дополнительную ценность для разработки приложений.

С точки зрения производительности лучше использовать:

 ng-repeat="r in roads", ng-hide="r.distance > 1000"

ИЛИ лучше помещать элементы в массив в контроллере, например:

 for (var i in $scope.roads) {
    var road = $scope.roads[i];  
    if (road.distance <= 1000) $scope.roadsToShow.push(road);
}

а затем использовать, просто ng-repeat вот так?

 ng-repeat="r in roadsToShow"

Что считается лучшей практикой с точки зрения повышения производительности? Представьте, что объектов в массивах более 1000.

1. Хорошим вариантом является реализация разбивки на страницы.. Таким образом, вы также повысите производительность своего серверной части

2. Позвольте мне объяснить. Разбивка на страницы предназначена для отображения всех результатов, разделенных на разных страницах. Вопрос в том, ng-повторить все объекты в массиве и показать только то, что мы хотим. ИЛИ поместить то, что мы хотим, в новый массив и ничего не фильтровать в DOM?

3. Второй вариант лучше с точки зрения производительности, потому что angular оценивает массив при каждом цикле дайджеста. Чем меньше элементов, тем быстрее. Также при использовании ng-show angular отображает их в DOM, что не требуется в вашей второй реализации

4. Отлично. Большинство мнений ведут туда. Спасибо

Ответ №1:

Фильтрация массива будет значительно лучше по нескольким причинам.

Наиболее важным из них является то, что ng-hide требуется создать внутренний контроль, а часы стоят дорого и могут вызвать узкие места в производительности

Во-вторых, будет меньше узлов dom для рендеринга

Существует множество способов выполнить фильтрацию и в angular.

Не используйте ng-hide ng-show ng-if etc в качестве инструментов фильтрации в ng-repeat

Ответ №2:

Лучше фильтровать элементы массива в контроллере или лучше на сервере вместо того, чтобы скрывать их после их визуализации. Если вы фильтруете массив перед его отображением, браузеру не нужно отображать DOM, связанный с элементом, а затем тратить время на его скрытие. Имейте в виду, что using ng-hide применяет класс CSS display: none к элементу, поэтому узел существует, но не виден.