简单了解Web Workers API
1. 为什么使用Web Workers API
通过使用该API,web应用程序可以独立于主线程,运行一个单独的线程来处理脚本。
可以在独立的线程中解决耗时较长的任务,避免主线程阻塞。
2. 应用
1. 新建一个worker.js文件,将耗时较长的js代码放入其中;通过postMessage传递数据
// worker.js
let sum = 0;
for(let i=0; i<1000000; i++) {
sum += i;
}
self.postMessage(sum); // self表示当前窗口
2. 新建Worker实例
const worker = new Worker('./worker.js'); // 传入一个文件
worker.onmessage = function(e){
// e.data获取传递的数据
}
简单了解Web Workers API的更多相关文章
- HTML5权威指南--Web Storage,本地数据库,本地缓存API,Web Sockets API,Geolocation API(简要学习笔记二)
1.Web Storage HTML5除了Canvas元素之外,还有一个非常重要的功能那就是客户端本地保存数据的Web Storage功能. 以前都是用cookies保存用户名等简单信息. 但是c ...
- 通过使用Web Workers,Web应用程序可以在独立于主线程的后台线程中,运行一个脚本操作。这样做的好处是可以在独立线程中执行费时的处理任务,从而允许主线程(通常是UI线程)不会因此被阻塞/放慢。
Web Workers API - Web API 接口参考 | MDNhttps://developer.mozilla.org/zh-CN/docs/Web/API/Web_Workers_API ...
- Web Workers文档
Web Worker为Web内容在后台线程中运行脚本提供了一种简单的方法.线程可以执行任务而不干扰用户界面.此外,他们可以使用XMLHttpRequest执行 I/O (尽管responseXML和 ...
- Web Workers - (Worker(专有) and SharedWorker(共享))
Web Worker为Web内容在后台线程中运行脚本提供了一种简单的方法 线程可以执行任务而不干扰用户界面 可以使用XMLHttpRequest执行 I/O (尽管responseXML和channe ...
- 利用web workers实现多线程处理
利用web workers在后台线程中实现对数据库的增删改查操作,并在后台线程中生成页面上某个列表的完整的HTML代码,然后再前台脚本中直接将这段HTML代码输出到页面上! 利用web workers ...
- 使用Web Workers处理线程
使用HTML 4和JavaScript创建出来的Web程序中,因为所有的处理都是在单线程中 HTML 5的Web Workers API,HTML 5中,一个Worker实际上为一个后台运行的线程.
- 通信API、使用Web Workers处理线程
1.跨文档消息传输 要想接受从其他的窗口那里发过来的消息,就必须对窗口对象的message事件进行监视. w ...
- html5 Web Workers
虽然在JavaScript中有setInterval和setTimeout函数使javaScript看起来好像使多线程执行,单实际上JavaScript使单线程的,一次只能做一件事情(关于JavaSc ...
- HTML5 Web Workers来加速您的移动Web应用
一直以来,Web 应用程序被局限在一个单线程世界中.这的确限制了开发人员在他们的代码中的作为,因为任何太复杂的东西都存在冻结应用程序 UI 的风险.通过将多线程引入 Web 应用程… 在本文中,您将使 ...
随机推荐
- dede5.7-修改自定义表单
最近刚好帮客户做一个网站,需要用到dede的自定义表单功能.可是有个这样的需求,就是当表单提交成功后,要返回一个自定义页面的提示功能!可能是觉得dede自带的提示太low的原因吧!(一不小心又黑了下)
- ssh使用
上传: scp myfile.txt username@192.168.1.1:/homw/ 下载: scp username@192.168.1.5:/home/myfile.txt / ...
- golang开发:(一)开发环境搭建vagrant+VirtualBox
开发环境介绍 不管何种开发语言,目前用的比较多的开发环境基本就是Vagrant+VirtualBox搭建的虚拟开发环境,这种开发环境的好处就是一次搭建处处可用,各个平台和系统都可以使用.开发团队中,可 ...
- IdentityServer4 手动验签及日志记录
IdentityServer4的基础知识和使用方式网上有很多特别优秀的文章,如果有对其不了解的推荐阅读一下下面的两篇文章 http://www.ruanyifeng.com/blog/2014/05/ ...
- Istio技术与实践6:Istio如何为服务提供安全防护能力
凡是产生连接关系,就必定带来安全问题,人类社会如此,服务网格世界,亦是如此. 今天,我们就来谈谈Istio第二主打功能---保护服务. 那么,便引出3个问题: l Istio凭什么保护服务? l ...
- QT-入门:创建项目时遇到工程工具集(Kit)找不到问题
创建项目遇到了以下提示: Please add a kit in the options or via the maintenance tool of the SDK 解决方法: 在指定的工具链中设置 ...
- apply,call和bind的使用及区别
1.用途 1)apply,call和bind都是 用来改变this的指向 2)apply和call会让当前函数立即执行,而bind会返回一个函数,后续需要的时候再调用执行 2.this指向问题 thi ...
- springboot注册到consul中报错:Spring MVC found on classpath, which is incompatible with Spring Cloud
今天在做springboot整合成springCloud并注册到consul中时,发现若注册到consule中成功 则不能启动swagger,且不能提供任何API服务,要是能提供API服务则不能注册到 ...
- [v]Linux下安装Git
Ubuntu12.04中默认没有安装Git.需要自行安装. 1. 安装Git 1.1 Ubuntu12.04下 可以使用apt-get方式安装,也可以下载源代码安装[1],我们这里使用apt-git安 ...
- TCP(上)
tcp头格式: TCP状态位: SYN表示建立连接, FIN表示关闭连接, ACK表示响应, PSH表示有 DATA数据传输, RST表示连接重置. TCP窗口: TCP 要做流量控制,通信双方各声明 ...