Angular js memory leak and website hang issue - angularjs

How to overcome this issue as website hangs and become unresponsive within 5 min

Open the site with Chrome and open the Developer tools and start exploring!
Check the network tab and try CPU profiling, your question lacks details. Upload an example...
Watch this more specific video to your question:
https://www.youtube.com/watch?v=j4Uvk5zxrhM

Install the Chrome plugin 'Batarang' to profile the performance of your AngularJS project. It will give you some insight about the digest cycles / performance. Such information in combination with some code can point to the cause of your problem.
Google Chrome plugin Batarang

Related

Confusion about Lighthouse report of unused JS for react devtools chrome extension

When I run Lighthouse for the project I am working on, I get
chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/react_devtools_backend.js
as no1 causer of unused JS.
How is that making sense from a performance optimization perspective?
I can't control what extensions the user runs in his browser.
I also can't find anything about the React dev tools in the project.
Would highly appreciate if someone could shed some light on that issue.
I found the issue is because the file of the devTools is installed when the page is loading... and it is useless in production mode.
So go to the extension and right click on it.
Then go to the manage extensions.
Then find the "Allow this extension to read and change all your data on websites you visit" change it to "on click".

How do I stop Angular from loading the .angular.min.js.map file when pulling Angular from a CDN?

I am working on a website which loads AngularJS from a CDN, and along with Angular it loads a 284KB map file (angular.min.js.map), which I understand is for debugging.
I don't want to debug, this is going into production, and 284KB is a lot! How do I stop this file from loading?
I can't edit the file (CDN), and it doesn't matter what my Google Chrome options are, I can't advise others to change their settings to use the website I am working on.
Thanks
According to http://blog.teamtreehouse.com/introduction-source-maps
The developer tools will only load this file if support for source maps is enabled and the developer tools are open.
So any impact will only be felt if someone opens their developers tools, which I suspect is acceptable, as in that case ability to debug it more important than download speed/size.
Within Google Chrome's inspector, have you unticked 'Enable JavaScript source maps' in Settings > General?
I think your dev setup is trying to pull the source map file in regardless, for others without this option ticked in Chrome's inspector it won't be a problem.
Don't worry about the source map files for production.
Only if a user has chrome dev tools or other source map compatible browser tools running will they request and download the source map file/s.

Dotnetnuke issue on certain pages

I have a website running on dotnetnuke. However, recently I can't do any action (edit content or page setting) on certain pages (the products subpges in www.midoco.com). Does anybody know why this happen?
What version of DotNetNuke are you on? Check the HOST SETTINGS page to see if you are using the HOSTED Jquery option, if so, try disabling that option.
It is probably a javascript issue, try firing up chrome developer tools (hit F12 in chrome) and check if you have a red X in the bottom right corner. If so, click it and check what causes the issue. I had some similar issues caused by single quotes insted of apostrophes in a language pack and spent a lot of time to find the issue. I just went to one of the pages and see you have an error in /engine1/script.js in your skin.

AngularJS app is not loading on Safari (iOS 5.1.1) back button. Any suggestions?

I've ran into an issue with Safari on iOS 5.1.1 and Angular where I am doing paginated results. After I decide to leave the page that is hosting the app, and then come back to the page by using the browser's history back button.
The application is not initialized so as I scroll again, the pagination functionality is not triggered.
Since 5.1.1 doesn't provide a web inspector, I had to rely on console.log to print events that I want to see that it's executing. On initial load, I see everything ok, but when I am back through the back button nothing fires.
My usual ways of fixing this are not working. Here are the things I've tried:
Used manual bootstrapping of Angular app
Made the page not support caching and expire the page as soon as it's rendered.
Neither of these helped, which is why I am here asking for some suggestions. Unfortunately it's not a very easy thing to replicate through a Fiddle or a hosted HTML file so I am unable to provide one. Hoping that some of you may have experienced this before.
Thanks in advance for any help.
Answer is quite late and I hope you found a solution already but it might be useful for others.
Unfortunately I won't be able to answer why the app is not initialized (due to the lack of code) but I can give you some tools/tips to ease the debugging (assuming you have the iOS simulator).
Debuging on mobile safari can be done either :
with weinre and get the features of the web concole,
or by enabling remote debugging in Mobile Safari itself, see here
Yea, same problem here with iOS 7. It must send the DOM structure over before running any javascript. Kinda pointless...
Since the problem is with mobile safari and since it supports popstate event, you can use this event to detect when the user is back in combination with $location.path(), for example:
$(window).bind("popstate", function () {
alert(location.pathname + $location.path());
});

How to debug application in extjs in internet explorer and Google chrome browser

Can anybody tell How to debug application in extjs in internet explorer and google chrome Browser? is it possible using Breakpoints to debug to check the values?
Thanks
There is a good article provided by sencha. check the section for internet explorer, http://www.sencha.com/learn/debugging-ext-js-applications
I have been forced to use IE8 in an application which works in Chrome and Firefox but fails often in IE8.
Debugging ExtJS in IE8 is nearly impossible if the problem is in the framework. IE8's developer tools hangs loading ext-all-dev.js
Also you can't get stack trace as in Chrome.
I had to put alert() calls in suspect lines and the whole process is a nightmare.
If you can avoid IE, do it.
Else be VERY VERY patient...
You can use the Developer Tools for your browsers. I don't use IE but I use Chrome's Developer Tools all the time! And yes you can do breakpoints, check values, etc..

Resources