AngularJS $http vs. $.ajax callback response time

[theug...@gmail.com]

I am trying to understand why AngularJS $http service success callback give me a slower response time compare to the $.ajax success callback.

I trigger this code 5 times with differents json files :

    if(isJquery){

      $.ajax({

        type : 'GET',

        url : url1,

        async : true,

        beforeSend: function(xhr){

             xhr.setRequestHeader('Content-Type',  'application/json;charset=UTF-8');

              xhr.setRequestHeader('Access-Token',  token);

         },

          success : function (returnData) {

                Chrono.getTime('ajax success')

         },

          error : function (xhr, textStatus, errorThrown) {

           },

          complete : function (){

            }

           });

       }else{

           var configuration = {

               method: 'GET',

               url: url1

            };

            var headers = {};

                 headers['Content-Type'] = 'application/json;charset=UTF-8';

                  headers['Access-Token'] = token;

                  configuration.headers = headers;

            $http(configuration)

               .success(

                function (data, status, headers, config) {

                       Chrono.getTime('httpService success')

                  })

                .error(function (data, status, headers, config) {

                 });

    }

With ajax I received this response time :

ajax success = 332

ajax success = 335

 

ajax success = 336

 

ajax success = 337

 

ajax success = 361

 

with $http :

httpService success = 325

httpService success = 357

 

httpService success = 380

 

httpService success = 430

 

httpService success = 538

 

I noticed that the response time increase even more when there is data or function to process in the success callback. It's like Angular is hanging before processing the other sucess callbacks...

I know Angulars is using promises to handle callbacks... could it explain why response time is increasing ? Maybe I didn't understand how to best use $http service.

I am open to suggestion and anaylsis.

Thanks for your time.

[squi...@gmail.com]

While I can't guarantee that this is the reason, it is probably due to Angular's reliance on the digest cycle to notice when the response is available. Both Angular and jQuery use a promise for handling the response from an AJAX request, so it's not directly due to promises. However, Angular's promises, to my understanding, are built on top of the digest cycle to notice when things change with respect to the resolution of the promise. This process is described at http://docs.angularjs.org/guide/scope#scope-life-cycle and also discussed in https://github.com/angular/angular.js/issues/2881 (hopefully those aren't confusing). As I understand it, basically, whenever an Angular AJAX request is resolved, it must trigger a scope digest cycle to notice that the promise has resolved. This digest cycle will then process everything, not just the AJAX request which just finished. This means that any other processing related to the digest cycle can cause the resolution of the AJAX request to be delayed.

I am reasonably new to Angular so some of this understanding might be incorrect. I hope that it is accurate enough to help you understand the potential causes of your problem.

[theug...@gmail.com]

Thanks for your answer. I think it makes sense.
So I guess if I want resolution not to be delayed I am stuck with Jquery Ajax. If anyone can offer me a better solution to solve this issue I am open to suggestions....

Thanks again for your help