AJAX 同步请求导致的UI阻塞问题

遇到的一个问题,大概是这样的。。。
AJAX 同步请求导致的UI阻塞问题
前端页面上有一个列表,遍历列表按照并发度执行ajax操作,需要等上一个并发度执行返回结果后才能决定是否进行下一个并发度的执行。

1、一开始的想法是,写一个ajax执行函数,传入每次执行的并发度,用for循环遍历列表,执行这个函数。比如有8个IP,然后并发度2,就for循环,执行4次的这个函数。但是,这样是不行的,因为ajax默认情况下是异步多线程的的,也就是说,我在执行第一个并发度的IP时候,它并不会等待后端的接口返回执行的结果再往下,而是会再开一个线程,执行下一个并发度的IP,这样就违背了我需要等待上一个并发度执行结果才能再继续往下执行的要求。

2、然后,第二个想法是,既然ajax是异步的,那我用async : false把它改成同步的不就好了,然后,这就导致了标题所示的问题,虽然这样就可以按照顺序来执行了,等上一个ajax请求返回结果后才执行下一个请求,但是,因为单线程的原因,导致ajax返回结果后前端UI的变化无法马上执行,而是直接执行下一个ajax了,也就是UI阻塞,知道ajax都执行完了才执行UI的变化,这样对用户很不友好,得等全部都执行完了才能看到变化,像个憨批。
查了下,如果想同步又执行UI的话,需要为AJAX请求写回调函数,就是接收到后端返回的结果后会执行的操作。因为一些原因这种方法在我的具体场景了好像也不行,就不研究了。
总是,ajax最好还是别设成同步的了,单线程不知道会出现什么问题,还是尽量在代码逻辑上支持异步的情况。

3、最好的解决方法是将执行的ajax函数改成递归的,也就是套娃hhh,全局设置一个flags标识,只有标识为True的时候才继续执行下去,而标识为False的时候则停止执行,在遇到终止条件是就把标识设为Flase(具体情况具体分析),并且需要写在ajax的sucess代码段,这样等待上一个请求成功返回执行结果才会进行判断是否往下执行下一个请求,这样就避免了第一种情况。
AJAX 同步请求导致的UI阻塞问题