javascript - jQuery ajax async: false causes a strange warning?

Question

In my JS App, i have many Ajax calls with async: false. I am using latest Chrome browser and in my console below warning appears recently.

Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check http://xhr.spec.whatwg.org/.

Now i am trying to change all async: false to async: true. But it causes a lot of error because my app needs to run with async: false.

Is the warning just a bug or something? Can i worry about that or ignore that?

Answer 1

JavaScript runs exclusively on the UI thread so a synchronous AJAX call will freeze the browser completely, until the server replies.

It's considered a bad pratice in UX Design for web applications and major browsers are deprecating this feature in favor of asynchronous requests with a callback.

You may not worry about the message now. It's not a bug but I strongly recommend you to start rewriting it because when a feature is marked as deprecated it means a warn that they can remove this feature anytime in the future.

It's also deprecated from jQuery 1.8+

As of jQuery 1.8, the use of async: false with jqXHR ($.Deferred) is deprecated; you must use the success/error/complete callback options instead of the corresponding methods of the jqXHR object such as jqXHR.done() or the deprecated jqXHR.success()

The recomended way:

var request = $.ajax({
  url: "script.php",
  data: { id : menuId },
  dataType: "application/json"
});

request.done(function(data) {
   // Executed in case of success
});

request.fail(function( jqXHR, textStatus ) {
  // Executed in case of error
});