JS利用HTML5的Web Worker实现多线程
需求:有一个长时间的斐波拉契的计算希望放在分线程中计算,计算的得到结果后再返回给主线程展示,再计算的时候不冻结页面
var number = 55;//传入分线程的参数
var worker = new Worker('worker.js');//利用一个js文件创建一个分线程
worker.postMessage(number);//向分线程传入数据
woker.onmessage=function(event){//设置分线程的回调函数,并接收返回的结果
console.log('接收到分线线程返回的数据:'+event.data);
}
下面是worker.js文件中的代码:
var onmessage = function(event){//接收主线程传入的数据并进行计算
var number = event.data;
var result = fibonacci(number);
postMessage(result );//返回主线程并传入返回结果
}
function fibonacci(n){//斐波拉契计算函数
return n<=2?1:fibonacci(n-1)+fibonacci(n-2);
}
注:当worker.js文件作为分线程调用的时候,worker.js文件中的this就不是指向window了,所有再分线程上面是不能使用window自带的很多函数的(比如alert),并且再分线程里面也就访问不到页面的任何元素。所以分线程的定位是只进行计算的,不做任何页面相关的操作。
JS利用HTML5的Web Worker实现多线程的更多相关文章
- Web Worker javascript多线程编程(二)
Web Worker javascript多线程编程(一)中提到有两种Web Worker:专用线程dedicated web worker,以及共享线程shared web worker.不过主要讲 ...
- Web Worker javascript多线程编程(一)
什么是Web Worker? web worker 是运行在后台的 JavaScript,不占用浏览器自身线程,独立于其他脚本,可以提高应用的总体性能,并且提升用户体验. 一般来说Javascript ...
- 【转】Web Worker javascript多线程编程(一)
原文:https://www.cnblogs.com/peakleo/p/6218823.html -------------------------------------------------- ...
- 通过一次实验来了解HTML5的 Web Worker
web worker 是运行在后台的 JavaScript,不会影响页面的性能. 当在 HTML 页面中执行脚本时,页面的状态是不可响应的,直到脚本已完成. web worker 是运行在后台的 Ja ...
- 深入理解javascript异步编程障眼法&&h5 web worker实现多线程
0.从一道题说起 var t = true; setTimeout(function(){ t = false; }, 1000); while(t){ } alert('end'); 1 2 3 4 ...
- html5之web worker
Web Worker 在本文中 与 Web Worker 进行双向通信 WindowTimers 在 IE10 Platform Preview 4 中对 Web Worker 的更新 API 参 ...
- JS多线程之Web Worker
什么是Web Worker web worker 是运行在后台的 JavaScript,不会影响页面的性能. 当在 HTML 页面中执行脚本时,页面的状态是不可响应的,直到脚本已完成. web wor ...
- 深入HTML5 Web Worker应用实践:多线程编程
HTML5 中工作线程(Web Worker)简介 至 2008 年 W3C 制定出第一个 HTML5 草案开始,HTML5 承载了越来越多崭新的特性和功能.它不但强化了 Web 系统或网页的表现性能 ...
- 深入 HTML5 Web Worker 应用实践:多线程编程
深入 HTML5 Web Worker 应用实践:多线程编程 HTML5 中工作线程(Web Worker)简介 至 2008 年 W3C 制定出第一个 HTML5 草案开始,HTML5 承载了越来越 ...
随机推荐
- B1027 打印沙漏
题目链接:https://pintia.cn/problem-sets/994805260223102976/problems/994805294251491328 1027 打印沙漏 (20 分) ...
- 题解【洛谷P1995】口袋的天空
题面 题解 从图中删边,直到图中只剩\(k\)条边,计算权值之和即可. 代码 #include <iostream> #include <cstdio> #include &l ...
- docker dial unix /var/run/docker.sock: connect: permission denied
Got permission denied while trying to connect to the Docker daemon socket at unix:///var/run/docker. ...
- mysql的数据库开放权限
链接数据库之后运行下面的命令即可 grant all PRIVILEGES on *.* to %username%@'%' identified by '%password%'; 如给root链接数 ...
- Mac下ssh远程无密码登录
入手Mac,对很多工具的使用都不太熟悉,这不,做web开发,登录远程服务器非常繁琐,想要去掉输入密码这个环节,找到网友的分享如下: http://www.cnblogs.com/shuaiwhu/ar ...
- Nuxt 环境搭建已经编写第一个Nuxt应用
在学习Nuxt 之前 首先我们要有node ,然后因为Nuxt 是一个基于 Vue.js 的轻量级应用框架,所以在开发之前需要安装(后面纯属作者猜想并且猜想就是这个原因...) npm install ...
- 每天进步一点点------Altium Designer集成库简介及创建
一.集成库概述 Altium Designer 采用了集成库的概念.在集成库中的元件不仅具有原理图中代表元件的符号,还集成了相应的功能模块.如Foot Print 封装,电路仿真模块,信号完整性 ...
- Vacation
题目看上去倒是蛮复杂的样子嘞!
- Ubuntu 16.04执行 sudo apt-get update非常慢解决方案
ubuntu在执行更新apt包索引 sudo apt-get update 可能遇到更新非常慢或者部分包都忽略或错误 我们应该进入到系统设置>软件与更新 选择其他站点 选择最佳服务器 然后点击关 ...
- composer update 或者 composer install提示killed解决办法
出现此原因大多因为缓存不足造成,在linux环境可增加缓存解决. free -mmkdir -p /var/_swap_cd /var/_swap_#Here, 1M * 2000 ~= 2GB of ...