All geek questions in one place

Angularjs performance issues in $ apply, but bindings are fast

I have a medium-sized angular app that uses angular -1.2.10 and ui-router-0.2.8. When I switch to a specific state, I get frame rate problems in the animation, whether I use $ animate on ng-show or manually animate it.

When I delve into the profiler, I see that $ is applied after XHR takes up to 200 ms. I believe that I am the reason for the lag. When I delete the code in the state I am going to, this problem goes as expected. enter image description here

There is not much ng repetition, and bindings are fast: enter image description here

, , . - -, , .

UPDATE incoginto , $digest. $Digest 40 . enter image description here

, , (30 +), .

UPDATE , , DOMSubTreeModified.

+4
3

Angular $digest , , - . , , , . , , , . , , :

  • , -, , "true" objectEquality. .

  • , - . $digests , .

  • $watch , DOM. , DOM $broadcasting ( XHR) , ,

  • CSS , ?

+7

$digests , , a $watch('a'), , , b, , $watch('c'), , ( ) $watch('a').

, $watch . , , .

+2

It's hard to help without code and bindings in the markup. If you have read-only parts of the user interface that are independent of a few digest cycles, try using bindonce: https://github.com/Pasvaz/bindonce . This can help you reduce the number of watchers and unexpected digest cycles.

0
source

Source: https://habr.com/ru/post/1527336/

More articles:


All Articles