If you are familiar with AngularJS development, you know that memory consumption is one of the highest challenge you must face using it.

Introducing angular-memory-stats

angular-memory-stats is a NPM package that allow you to follow the memory consumption of your AngularJS application.

Install via NPM

npm i angular-memory-stats --save

Include the AngularJS module to your application

angular.module('yourModule', [
    'angular-memory-stats'
])

Insert the directive in the dom

<angular-memory-stats></angular-memory-stats>

Enable/Disable angular-memory-stats

angular-memory-stats is enabled by default, if you wish to disable it use the angularMemoryStatsProvider Provider

angular.module('yourModule').config(function(angularMemoryStatsProvider){
    angularMemoryStatsProvider.enable(false)
});

Then all you need to do is to launch Chrome (only available on Chrome for now) with the --enable-precise-memory-info and --enable-memory-info flags

# Linux
google-chrome --enable-precise-memory-info --enable-memory-info

#MacOS
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --enable-precise-memory-info --enable-memory-info

Open your application and you will have the following indicator on the bottom right corner of your browser:

Source available on Github