Angular.js performance issues

Batarang on the performance tab shows that at the root of the application, angular calls a function that looks like this: function (a){var e,f,i=a.$eval(h),m=hc(i,

According to batarang, this is painfully slow, and when I get a bit more lines in the application, it slows down the application and causes Firefox to crash (although Chrome still processes it). So what the hell is he doing this? How can i fix this?

+7
source share
2 answers

Something to keep in mind when creating an Angular application, where you dynamically extend the contents of ngRepeat. Each custom ngRepeat configures the clock. Each {{binding}} or ngModel that you do inside this replay sets up a different clock, etc. Each of them creates instances of functions and objects, and must also be processed on each $ digest. Thus, if you encounter performance problems, you may need to implement a custom directive that records your data without setting up these extra hours, so you are a bit more productive. This is my 2 cents.

+16
source

So, I came across these months after the question was asked when I had what, in my opinion, is a similar problem. Let me describe my problem and my solution (which does not include the directive), and you can see if it applies to yours.

I built a table. First, I would request information telling me which rows were in the table, then I will ask for additional information that populates the table cells. Therefore, I would receive the first query and add all the rows to the table, and then query the cell data. I would get cell data row by row, but there would still be a lot of queries in a large table. When I return the cell data for this row, I would populate it.

This is done for a really healthy effect, all cells with rotating icons are waiting for data. BUT, this made it very slow. In Chrome, it was good, the browser slowed down some, but it continued to work. But in FF, it would cause an annoying “busy or non-responsive messsage script. If you click Continue, it will work fine, but if you click Cancel, you will stop the script and it won’t work.

So, here is the solution I came up with. No directive required. All I did was completely build the data for each row and only then add the row to the variable used by ng-repeat. Thus, it is much faster. The rows are filled when all the data is returned, the $ watch hours still exist, but you don’t start a ton right away, and you can still be able to change the data later (in my table, you can edit each cell of the table to be able to easily change the data later).

Hope this helps someone.

+2
source

All Articles