如何减少此javascript代码'；什么是cpu使用率？

现在我正在优化一些js代码。
有一个名为appendXYZ的函数，它与其他函数一起在循环中调用。
如下所示：

function OuterFunc (){
  for(...){// about 150 times
     ...
     appendXYZ();
     //other dependent functions
     ...
  }
}

现在我非常确定appendXYZ会导致高cpu使用率-它可以达到50%，
但如果我删除此函数，cpu使用率仅为1%。
当cpu使用率为50%时，浏览器几乎冻结，页面缺乏响应。
此外，OuterFunc每20秒执行一次，appendXYZ来自第三方脚本代码，我无法修改它。
那么如何优化此代码？

---

现在我尝试使用setTimeout，但我不知道它是否有效。

我不知道该函数的作用，但您可以尝试使其调用异步

它可能工作，也可能不工作，仍然需要相同数量的CPU，但它至少应该释放浏览器一点空间

function OuterFunc (){
  for( var i = 0; i < 150; i++ ){
     // ...
     setTimeout( appendXYZ, 0 );
     //other dependent functions
     // ...
  }
}

函数OuterFunc（）{
对于（变量i=0；i<150；i++）{
// ...
setTimeout（appendXYZ，0）；
//其他相关函数
// ...
}
}

这可能会再次破坏功能。如果看不到更多代码，就无法判断

如果要传递参数，则需要以下内容：

function invoker( j ) {
   return function() {
       appendXYZ( j );
   };
}

function OuterFunc (){
  for( var i = 0; i < 150; i++ ){
     // ...
     setTimeout( invoker( i ), 0 );
     //other dependent functions
     // ...
  }
}

函数调用程序（j）{
返回函数（）{
附录xyz（j）；
};
}
函数OuterFunc（）{
对于（变量i=0；i<150；i++）{
// ...
setTimeout（调用程序（i），0）；
//其他相关函数
// ...
}
}

我不知道该函数做什么，但您可以尝试使其调用异步

它可能工作，也可能不工作，仍然需要相同数量的CPU，但它至少应该释放浏览器一点空间

function OuterFunc (){
  for( var i = 0; i < 150; i++ ){
     // ...
     setTimeout( appendXYZ, 0 );
     //other dependent functions
     // ...
  }
}

函数OuterFunc（）{
对于（变量i=0；i<150；i++）{
// ...
setTimeout（appendXYZ，0）；
//其他相关函数
// ...
}
}

这可能会再次破坏功能。如果看不到更多代码，就无法判断

如果要传递参数，则需要以下内容：

function invoker( j ) {
   return function() {
       appendXYZ( j );
   };
}

function OuterFunc (){
  for( var i = 0; i < 150; i++ ){
     // ...
     setTimeout( invoker( i ), 0 );
     //other dependent functions
     // ...
  }
}

函数调用程序（j）{
返回函数（）{
附录xyz（j）；
};
}
函数OuterFunc（）{
对于（变量i=0；i<150；i++）{
// ...
setTimeout（调用程序（i），0）；
//其他相关函数
// ...
}
}

一种可能性是，

OuterFunc

执行时间大于重复间隔。
换句话说，

OutherFunc

执行时间超过20毫秒，每20秒调用一次它将产生一个异常，因为函数在无限循环中完成执行之前被调用。
如果使用

setInterval

每20毫秒执行一次

OuterFunc

函数，则可以通过使用

setTimeout

调用模拟

setInterval

函数来解决此问题：

(function helper(){
    OutherFunc();
    // after the OutherFunc is done executing, trigger it after 20 milliseconds
    setTimeout(helper, 20);
})();

只有当

setInterval

是浏览器冻结的原因时，这可能会对您有所帮助。
如果这对您没有帮助，如果您不太关心旧浏览器，也许您可以使用实现一种“线程化”。这样，你的代码就会在不同的线程中执行，这肯定会加快你的应用程序的速度（又称“再见，再见，浏览器冻结”）

---

希望这有帮助

一种可能性是，

OuterFunc

执行时间大于重复间隔。
换句话说，

OutherFunc

执行时间超过20毫秒，每20秒调用一次它将产生一个异常，因为函数在无限循环中完成执行之前被调用。
如果使用

setInterval

每20毫秒执行一次

OuterFunc

函数，则可以通过使用

setTimeout

调用模拟

setInterval

函数来解决此问题：

(function helper(){
    OutherFunc();
    // after the OutherFunc is done executing, trigger it after 20 milliseconds
    setTimeout(helper, 20);
})();

只有当

setInterval

是浏览器冻结的原因时，这可能会对您有所帮助。
如果这对您没有帮助，如果您不太关心旧浏览器，也许您可以使用实现一种“线程化”。这样，你的代码就会在不同的线程中执行，这肯定会加快你的应用程序的速度（又称“再见，再见，浏览器冻结”）

---

希望这有帮助

如果您无法对实际代码进行优化，则可以分散循环迭代的执行，以保持浏览器的响应性。根据，您可以按住UI并使其感觉对用户有响应的最长时间是100毫秒。有关如何使用

setTimeout

执行此操作的技术，请参见。

如果无法优化实际代码，则可以分散循环迭代的执行以保持浏览器响应。根据，您可以按住UI并使其感觉对用户有响应的最长时间是100毫秒。有关如何使用

setTimeout

执行此操作的技术，请参见。

但是appendXYZ的作用是什么？知道它被执行了150次并没有多大帮助。所以你基本上是在问“我如何使代码修改得更快”？你可以使用web workers:。但是循环本身可能无法优化，您需要优化

appendXYZ

。appendXYZ是一个包装函数，它有点复杂。它在地图中查找所有标记节点并设置位置。这段代码基于谷歌地图（百度地图）。但是appendXYZ做什么呢？知道它被执行了150次并没有多大帮助。所以你基本上是在问“我如何使代码修改得更快”？你可以使用web workers:。但是循环本身可能无法优化，您需要优化

appendXYZ

。appendXYZ是一个包装函数，它有点复杂。它在地图中查找所有标记节点并设置位置。这段代码是基于谷歌地图（百度地图）的。这难道不会更快地冻结浏览器吗？我的意思是这样，

OuterFunc

执行得更快，但是