Problemy z wydajnością migracji Angular 1.x

Uaktualniam duży projekt kątowy 1 z wersji 1.3.x do wersji 1.6.x, ponieważ wymagamy niektórych poprawek w najnowszej wersji. Po aktualizacji wydaje się, że cała aplikacja znacznie się spowolniła. Przeglądałem dokumentację dotyczącą migracji, ale czy jest coś, co może powodować poważne spowolnienia? Jakiś zły kod lub błędy, które by to spowodowały? Mam problemy tylko ze zmianami wizualnymi, takimi jak ng-show i ng-hide, które są powolne i nerwowe.Problemy z wydajnością migracji Angular 1.x

Jest to profil CPU przed aktualizacją:

Jest to profil procesora po uaktualnieniu:

Dziękujemy!

EDYTOWANIE:

Pozwolę sobie podać nieco więcej kontekstu. Mam wrażenie, że ma to związek z cyklem trawienia. Na przykład: I to pasek nawigacyjny, w którym ukryje się ikona, a inny po najechaniu myszą.

Oto jak to wygląda w kątowym 1,3

Oto jak to wygląda w kątowym 1,6

Otrzymuję wymuszone przetapiania ostrzeżenie wydajności po aktualizacji. Również ten styl (ponownie obliczany styl) jest kierowany z funkcji computeCssStyles o wartościach kątowych (lub przynajmniej jest to linia kodu, którą kieruje do mnie). Nie wzywam też żadnego z $ animate w moim kodzie. Czy jest to tylko efekt metody skoku kątowego? Czy jest też coś, czego brakuje mi w dokumentach migracyjnych na temat możliwych zmian w skrócie?

Przykładowy kod: showDropdown został zmieniony z false na true na zawisie i na odwrót.

<i> ng-show="! showDropdown" </i><i> ng-show="showDropdown" </i>

EDIT: krótkoterminowe fix jak nie używam animować nigdzie w moim kodu, ale wydaje się być wypalanie zgodnie z nowszych metod kątowej strawienia. Po prostu wyłączyłem animacje jako częściową poprawkę krótkoterminową.

$animate.enabled(false);

Źródło

2017-03-17 Alexg2195

Wiem, że to może zająć trochę czasu, ale co z użyciem ng-if zamiast ng-show/hide? jeśli ukrywasz dyrektywy, nadal będą działać, z ng - jeśli nie zostaną skompilowane, chyba że będzie to konieczne - to jest mniej zegarków podczas działania, gdy są one ukryte. Jakie zmiany wizualne masz na myśli? czy Twój model musi zostać oceniony, jeśli po prostu pokazujesz/ukrywasz obrazy? Może możesz nad tym popracować, więc cykl trawienia nie zostanie zwolniony. –

@ Gonzalo.- Dam ci ng-jeśli spróbuję. Będę musiał to zmienić w wielu dyrektywach. Zmiany wizualne, o których mówię, są tak proste, jak nawigacja. Gdzie mamy dwie różne ikony, które ukrywają się i pokazują na podstawie zmiennej. ' ng-show = "! ShowDropdown" ng-show = "showDropdown"' Gdy zmienna showDropdown zmienia to widać zarówno na ułamek sekundy, a następnie ukrywa drugą. – Alexg2195

Jest mało prawdopodobne, że na to pytanie można odpowiedzieć. Wymaga to przykładu, który może replikować problem. Fakt, że w grę wchodzą części wizualne, mówi dosłownie nic. Są one po prostu aktualizowane po trawieniu. Oczywiście ujawnią opóźnienia - ponieważ są wizualne. – estus

Zarządzanie pamięcią jest trudne w JavaScript. Oto kilka sprawdzonych metod zwiększania wydajności w zakresie ładowania stron i zwalniania pamięci.

Ręczne usuwanie węzła wolnostojącego - kontynuuj pracę, aby usunąć odłączony obiekt.

var myNode = document.getElementById("bodyPanel"); 
    if(myNode !== null){ 
    while (myNode.firstChild) { 
    myNode.removeChild(myNode.firstChild); 
    } 
}

Na każdy przełącznik widoku, Call zniszczyć wewnątrz angularjs kontrolera. javaScript również obiekt referencyjny do null

$scope.$on("$destroy",function() { 
    $window.off("resize.Viewport"); 
});

Tworzenie kątowa js życzenie zachować ważne dane w pamięci, aby uniknąć pobierania z systemu magazynowania HTML5.
Jak wspomniano w komentarzu, należy użyć ng-if zamiast ng-show.

Źródło

2017-03-27 11:57:19 Vish

Problemy z wydajnością migracji Angular 1.x

Odpowiedz

Powiązane problemy