Web Worker 20倍性能下降

Question

我似乎无法在任何地方找到明确的答案.

我有非常简单的POC,它以同步和异步方式计算相同的功能.

Worker.js

onmessage = function(e) {
  var s = new Date().getTime();
  i = 0;
  var avg = Math.random();
  while ( i < e.data ){
    avg = (avg + Math.random()) / 2 ;
    i++;
  }
  var d = new Date().getTime();
  console.log( 'Duration ' + (d - s) );
  postMessage( avg );
}

的index.html

<script>
var mw = new Worker("worker.js");

mw.onmessage = function(e) {
    console.log('Worker says: ' + e.data);
  };

function av ( j ){
  var s = new Date().getTime();
  i = 0;
  var avg = Math.random();
  while ( i < j ){
    avg = (avg + Math.random()) / 2 ;
    i++;
  }
  var d = new Date().getTime();
  console.log( 'Result is ' + avg );
  console.log( 'Duration ' + (d - s) );
}



function runSync(){
  av( 100000000 );
}
function runAsync(){
  mw.postMessage( 100000000 );
}

</script>

  <a href="#" onClick="runSync()" /> Run Sync </a>

  <a href="#" onClick="runAsync()" /> Run Async </a>

在我的4核MacBook上,这会产生:

Result is 0.47398200501358567
Duration 985
Duration 23187
Worker says: 0.7422913957976759

正如您所见,Web worker需要花费20倍的时间来处理.对此有何解释？其他相关的帖子建议垃圾收集和堆,但后来发现罪魁祸首是一些API问题.我很想知道工人是什么,不是什么.当垃圾收集器运行时,它们有一些奇怪的性能损失吗？如果是这样,你如何以一种避免这种瓶颈的方式管理内存？

Answer 1

它们不是完全相同的函数，您e.data在工作线程中访问，这比直接访问缓存慢很多j，如果您更改它，它们应该花费大约相同的时间。