Webworkers的多线程效率低下吗?

解决方案您的基准测试被向每个工作人员转移一千万个数字的成本所淹没.相反，创建一个 ArrayBuffer .将其作为 transferList ( postMessage 的第二个参数)的一部分传递.在我的机器上，工人在不到100毫秒内完成这项工作，而没有工人在200毫秒内完成工作.请参见 https://jsfiddle.net/ooduhb5h/7/.I have a project in which I have to process quite large objects, each taking about 500ms. I thought that using web workers would greatly speed up this process. But after playing around with web workers, they didn't seem to improve the speed at all - even if I took away the preprocessing the creation of the web workers.So I decided to create a simple example: there is an array with N numbers, and the sum of those numbers should be calculated.So first, without webworkers (DEMO):/** Goal: return sum of all numbers in array */var numbers = [];for(var i = 0; i < N; i++){ numbers.push(Math.floor(Math.random() * 100));}/** Test without web workers */var total = 0;for(var i = 0; i < numbers.length; i++){ total += numbers[i];}Then, with webworkers (DEMO):/** Options */var WORKERS = 5; // N should be divisble by WORKERS/** Test WITH web workers */var workers = [];var source = `onmessage = function(e) { var total = 0; for(var i = 0; i < e.data.length; i++){ total += e.data[i]; } postMessage(total);}`for(var i = 0; i < WORKERS; i++){ var blob = new Blob([source]); var blobURL = window.URL.createObjectURL(blob); let worker = new Worker(blobURL); worker.onmessage = function(e){ total += e.data; worker.terminate(); if(++finished == workers.length) done(); } workers.push(worker);}var finished = 0;var chunk = Math.floor(N / WORKERS);var sliced = [];for(var i = 0; i < workers.length; i++){ sliced.push(numbers.slice(i*chunk,i*chunk+chunk));}// we calculate time after we created the workers, from herevar total = 0;for(var i = 0; i < workers.length; i++){ workers[i].postMessage(sliced[i]);}function done(){ // do something}So the results: webworkers seem to be completely disastrous. It's over 10x slower than without webworkers.So my question, can anyone show me an example where multithreading with webworkers is actually faster? I'm failing to see the point of webworkers besides running without affecting the UI....Edit: it runs over way slower, but the CPU usage is way higher (100% with, ~30% without webworkers) - it makes me question where all that power is going toEdit 2: Even when you leave the onmessage on the worker side do nothing, it still runs way slower... it seems like the communication between the main thread and the worker thread is just incredibly slow (see for yourself)Edit 3: it's not related to postMessage, I have measured performance and it's nothing I can do about by coding differently. The weirdest thing of all: when I measure performance with Google chrome dev tools, it runs almost 2x as fastInteresting article: 解决方案 Your benchmark is being swamped by the cost of transferring ten million numbers to each worker.Instead, create a ArrayBuffer. Pass that, as part of transferList (the second parameter to postMessage). On my machine the workers run this job in less than 100ms compared to 200ms without the workers.See https://jsfiddle.net/ooduhb5h/7/. 这篇关于Webworkers的多线程效率低下吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！