How to implement multi-threaded thread in jQuery

Question

I have 20 pages, each page contains 30 li tags, as shown below,

 <li id="1">1<li/> <li id="2">2<li/> <li id="3">3<li/> <li id="4">4<li/> <li id="5">5<li/> ... 

I would send an ajax(.getJSON()) call ajax(.getJSON()) as a multi-threaded thread for each li tag, I did this using the following jQuery code, but this is one after another ajax calls (.getJSON) it takes 2 seconds to complete one ajax call (business logic + presentation logic). To load the entire page, it takes 60 seconds (2x30).

 jQuery(li).each(function(e) { jQuery.getJSON(JSonUrl,{}, function(json) { // AJAX Response. if (json == null) { } else { var jsonList = json.deviceStatusString.split(','); var jsonInnerList = jsonList[0].split('#'); ... } } ); }); 

Could you help me launch all ajax calls like java multi thread?

Answer 1

I believe that you click the maximum number of requests, and therefore your browser waits until new threads appear. Check out this topic: How many concurrent AJAX requests (XmlHttpRequest) are allowed in popular browsers?

Answer 2

If you encounter performance errors with multiple AJAX requests, one of the things you should always try to do is minimize all these AJAX calls to fewer calls, it is best if you can throw it all in one AJAX call.

This way you get rid of a whole bunch of overhead associated with throwing and supporting multiple HTTP requests.