简单了解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 应用程… 在本文中,您将使 ...
随机推荐
- (4)Spring Boot Web开发---静态资源
文章目录 对静态资源的映射规则 模板引擎 Thymeleaf 使用 & 语法 使用之前将的快速创建项目的方法,勾选我们需要的场景,这里我需要 web --> web.sql --> ...
- CMakeLists 添加 -pthread 编译选项 undefined reference to pthread_atfork
在与 main() 函数同级的 CMakeLists 中添加如下内容(根据项目实际情况修改): cmake_minimum_required (VERSION 2.6) find_package (T ...
- 字符串char vchar性能对比补充
Value CHAR(4) Storage Required VARCHAR(4) Storage Required '' ' ' 4 bytes '' 1 byte 'ab' 'ab ' 4 ...
- PAT(B) 1088 三人行(Java)
题目链接:1088 三人行 (20 point(s)) 参考博客:PAT (Basic Level) Practice (中文)1088 三人行 (20 分)(Java实现)吃口雪花 题目描述 子曰: ...
- 解决Html页面缓存
对于一个html页面,缓存分3部分,一个是页面内容,一个是css样式,一个是JS文件 CSS和JS文件缓存 <link rel="stylesheet" type=" ...
- ArcGIS JS之 applyEdits之后要素符号更新
ArcGIS JS版本 ArcGIS JS 4.11 最近做一个地图服务,通过FeatureLayer.applyEdits()方法,更新唯一值的渲染字段,实现地图渲染根据用户的配置实时更新. 由于A ...
- linux学习之路(三)--centos7安装mysql(单点)
1.先检查系统是否装有mysql rpm -qa | grep mysql 返回空值,说明没有安装. 这里执行安装命令是无效的,因为centos-7默认是Mariadb,所以执行以下命令只是更新Mar ...
- sqlserver 统计每分钟内的数量
1.统计每分钟内 url 的访问数量 SELECT SUBSTRING(CONVERT(varchar(100), date, 20), 0,17) as dateTime,COUNT(url) as ...
- 解决Vs控制台程序出现NuGet\profile.ps1,因为在此系统上禁止运行脚本错误时或提示:“无法加载文件 \.nuget\packages\Microsoft.EntityFrameworkCore.Tools\1.1.0-preview4-final\tools\init.ps1,因为在此系统上禁止运行脚本”
1,打开Windows PowerShell 2.输入 set-executionpolicy remotesigned 即可执行脚本 如果执行命令失败的话重新选择Windows PowerShell ...
- Asp.netCore 的Startup 不继承接口
有一个问题: Asp.netCore 的Startup 要实现 Config 和ConfigServie 方法, 为什么不接口约束呢. 进入源码: // // 摘要: // /// Specify t ...