当前位置:   article > 正文

Web Worker为JavaScript开启多线程_worker线程最大激活数

worker线程最大激活数

什么是 Web Worker?

当在 HTML 页面中执行脚本时,页面的状态是不可响应的,直到脚本已完成。

web worker 是运行在后台的 JavaScript,独立于其他脚本,不会影响页面的性能。您可以继续做任何愿意做的事情:点击、选取内容等等,而此时 web worker 在后台运行。

 如何实现?

主线程上

  1. const workerCaculate=(expression)=> {
  2. let result;
  3. if(typeof(Worker) !== "undefined") {
  4. let w;
  5. if(typeof(w) == "undefined") {
  6. //引入子线程文件,reac中的使用,引入的一定是相对根目录的文件,因为react执行的是打包后的文件,此时如果写临近目录(非根目录)的文件,会找不到文件引用的
  7. w = new Worker("/workflow/exceldesign/js/caculate_wev8.js");
  8. }
  9. //向子线程传递主线程的数据
  10. w.postMessage(expression);
  11. //接收子线程传过来的数据并处理
  12. w.onmessage = function(event) {
  13. console.log(event.data)
  14. result= event.data;
  15. w.terminate();//清除子线程
  16. };
  17. } else {
  18. console.log("抱歉,你的浏览器不支持 Web Workers...");
  19. result = eval(expression)
  20. }
  21. return result;
  22. }

子线程上/workflow/exceldesign/js/caculate_wev8.js文件里

  1. //子线程内容
  2. onmessage= function(event){//event.data是主线程传过来的数据
  3. let result=0;
  4. //子线程内对主线程的数据做一些处理
  5. let calculate = new ___Calculate();
  6. result = calculate.calculateResult(event.data);
  7. //将处理后的数据传给主线程
  8. postMessage(result);
  9. }

 

reac中的使用,引入的一定是相对根目录的文件,因为react执行的是打包后的文件,此时如果写临近目录(非根目录)的文件,会找不到文件引用的

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/从前慢现在也慢/article/detail/236978
推荐阅读
相关标签
  

闽ICP备14008679号