Recently, there have been very interesting articles on this topic. There are some really amazing sources of creating objects that don't attract attention if you aren’t attuned to it. As a rule, the problem is not in the use of memory, but in fact the garbage collection cycles necessary to collect memory, the application flows slowly.
This article is the best I've read on the topic recently: http://www.scirra.com/blog/76/how-to-write-low-garbage-real-time-javascript
As for tools to combat / diagnose the problem, Google Chrome Speedtracer comes to mind. Of course, customization for Chrome does not guarantee customization for all browsers, but most of the things that cause objects to be created in Chrome are common to the JS specification, as it is implemented by all browsers.
It is important to remember that the use of RAM and the use of video memory do not match. One of the best practices is to determine which parts of your user interface will be hardware accelerated, and make sure they are small (that is, they fit on the screen all at once). If you have huge parts of the hardware acceleration of the screen scroll, you will get tears / GPU tiling and scrolling. You can partially discover this with the iOS simulator. This article briefly discusses the idea: http://devinsheaven.com/turn-your-iphone-wacky-and-make-your-iphone-application-better/
Finally, in JavaScript, there are a bunch of really common memory errors that every engineer comes across from time to time. IBM has a good list. I can’t post more than two links because I am n00b, but you can google for “Common JavaScript Memory Leaks”, and this is probably the first result.
Jackson gabbard
source share