spin.js在IE和FF上长时间运行线程时停止旋转

spin.js stops spinning during long running thread on IE and FF

本文关键字：线程 运行 旋转 长时间 js IE FF spin      更新时间：2023-09-26

我的代码:

$(document).ready(function () {
    $("#divContent").hide();
    $("#divProcessing").spin();
    $("#divProcessing").show();
    setTimeout(function () {
        Longrunningfunction1
        Longrunningfunction2
        Longrunningfunctionn
        //All done
        $("#divProcessing").hide();
        $("#divContent").show();
        $("#divContent").style = "margin-top:60px;height:100%;display:''";
        $("#tabbed-nav").data('zozoTabs').refresh();
    }, 0);
});

使用SetTimeout如上所述，我设法让处理div行为正确，即显示，然后隐藏和显示内容div时，一切都完成了。问题是，在IE和FF中，旋转器在一段时间后停止旋转。在Chrome中，它工作完美，旋转器继续运行。

I have try:

  • 强制重画处理div
  • 使用不同的js旋转器(比spin.js更糟糕的行为-它们从不出现)
  • 使用css3动画代替spin.js(从不动画)
  • 额外settimeout
  • 设置时间间隔试图让用户界面重绘。

到目前为止什么都没起作用。除了将长时间运行的流程移到新视图之外，我还能做些什么吗?我知道这些问题是与js是单线程的，但由于chrome是好的，我认为可能有一个解决方案。谢谢。

首先我通常的注意:JavaScript不是单线程的。只是在浏览器上，只有一个主UI JavaScript线程。但是JavaScript，这种语言，几乎没有线程的概念，并且可以(并且已经)在其他环境中以多线程的方式实现。

一些浏览器也使用相同的UI线程来执行非JavaScript任务，似乎spin.js要么依赖于JavaScript(因为它谈论关键帧的东西)，要么受到主UI线程繁忙的影响。

如果可能的话，解决方案是将长时间运行的函数从主UI线程移到web worker中。这有很多好处，尤其是在worker工作时UI保持响应。

Web worker在现代浏览器中得到很好的支持，但不支持IE8或IE9以及v4.4.4之前的Android浏览器。

相关文章：