AngularJS - How To Delay the $Digest() Cycle

Aaron Gray over at his blog recently posted a neat trick for reducing lag from the $digest() cycle when scaling AngularJS apps with large data sets. He recommends using a debounce function to put a delay on the $digest() cycle.

What’s a debounce function, you ask? Well, John Hann wrote a great explanation and implementation using pure JS way back in the late 2000’s. Years later, people ported this pattern to custom angular services. These were more “angularish”, but added a little clutter to your code. But now, Angular 1.3 has officially added support for debounce and delaying the digest cycle in a way that is super easy to use.

Gray finds it much simpler, now that native support has been added, to delay the $digest() function using only one line of HTML:

<input ng-model="user.name" ng-model-options="{ debounce: 150 }" />