ajax请求与UI进程阻塞
转自:https://blog.****.net/yintianqin/article/details/73833239
感谢大佬在与后台实现数据交互时经常会遇到一种这样的情况:
1.需要用一个ajax请求后台数据,并且要在获取到数据之后再渲染到页面,这个时候就必须用同步(async:false)。
2.然而在这个时候就会有另一种情况,当ajax的请求花费的时间比较长的时候需要一个loading层来显示等待状态
3.这个时候beforeSend是没有效果的,即使把loading的代码写在ajax之前也不行。
4.原因就是ajax的async设置为false时浏览器的渲染(UI)线程和js线程是互斥的,在执行js耗时操作时,页面渲染会被阻塞掉。当我们执行异步ajax的时候没有问题,但当设置为同步请求时,其他的动作(ajax函数后面的代码,还有渲染线程)都会停止下来。即使我的DOM操作语句是在发起请求的前一句,这个同步请求也会“迅速”将UI线程阻塞,不给它执行的时间。这就是代码失效的原因。
5.解决方法(注意:是在异步下实现的):如图