AngularJS ships with a collection of 25 built-in services. Thirteen of them are registered as providers, which means that we can configure them before they are instantiated for the first time. Configuring some of these providers can have a real impact on our application performance and behavior. Let's explore some of the lesser-known angular built-in providers methods.

$httpProvider

As of angular 1.3, $httpProvider introduces a new method called 'useApplyAsync' which takes a boolean.

By default, each time the $http service is resolved it launches an Angular digest cycle, keeping our view in sync. By enabling applySync, Angular combines the processing of multiple http responses received at around the same time and fires the digest cycle just once.

For large apps with many http calls, this can really boost performance.

function appConfig ($httpProvider) {
    $httpProvider.useApplyAsync(true)
}

angular.module('app',[])
    .config(['$httpProvider',app])

$compileProvider

Angular attaches information about scopes to DOM nodes, and adds CSS classes to data-bound elements by default. It's a very welcome operation while developing, because it enables us to debug Angular easily from the browser console or a 3rd party plugin. It's highly recommended to disable this feature in production so that it does not impact performance.

function appConfig ($compileProvider) {
    $compileProvider.debugInfoEnabled(false)
}

angular.module('app',[])
    .config(['$compileProvider',app])

$controllerProvider

By default, Angular DI looks for controllers that are registered through the module.controller method. Therefore, this code will fail:

app.js

function MainController () {
    this.title = "Controller provider Rocks!"
}

app.html

<div ng-controller="MainController as main">
    <h1>{{ main.title }}</h1>
</div>

By calling the allowGlobals() method from the $controllerProvider class, we can instruct Angular to look for controllers that are defined globally, which makes the last example work.

$interpolateProvider

The $interpolate service is used by the HTML $compile service for data binding. This provider enables us to change the default markup for angular binding experssions, which is "{{" and "}}":

app.js

function appConfig($interpolateProvider) {
    $interpolateProvider.startSymbol("%=");
    $interpolateProvider.endSymbol("=%");
}

function MainController () {
    this.title = "Interpolate provider rocks!"
}

angular.module('app', [])
    .config(['$interpolateProvider',appConfig])
    .controller('MainController', MainController);

app.html

<div ng-controller="MainController as main">
    <h1> %= main.title =% </h1>
</div>

$rootScopeProvider

Angular sets a limit of 10 iterations per digest cycle. In some rare cases, in complex applications, we will need some extra iterations in order to stabilize our model.

Please note! Increasing the digest iteration limit could have performance implications. It should be used when there is no other choice.

function appConfig($rootScopeProvider) {
    $rootScopeProvider.digestTtl(12);
}

angular.module('app', [])
    .config(['$rootScopeProvider',appConfig]);

Summary

By configuring Angular built-in services, we can change how Angular works and performs. I suggest reading more about Angular providers that I did not include in this post and make use of them when needed.