JavaScript采用的是单线程模式,它每次也只能执行一个事件,所以它在加载大量的事件的时候会比较慢。

而web-worker的作用就是给JavaScript提供一个多线程的模式。

  注意的是

    web-worker是无法操作DOM的节点的,它不能再主线程中调用的子线程中的函数,并且只能使用原生js进行编写。

    还有web-worker我在网上看见说是在部分浏览器里面是无效的,我在电脑上Google及Safari(电脑上仅有这两个浏览器╮( ̄▽ ̄)╭)上面测试了一下是没有问题的。

web-worker的使用

  创建主线程

    使用new来创建一个worker的函数,

var worker = new Worker("./work.js")

    然后使用worker.postMessage('...')向子线程方式数据

    接收子线程的数据

worker.onmessage = function(){
console.log(event.data)
}

  子线程

    在主线程中想子线程发布的数据使用

onmessage =function (event){
var mar_skt = event.data; //通过event.data获得发送来的数据
console.log(mar_skt); //打印数据
}

    然后在使用postMessage向主线程发生在子线程内容执行完毕的内容

postMessage(data)

  在不想要worker的时候也可以直接使用terminate()来结束它

worker.terminate();

  

web-worker 的使用的更多相关文章

  1. JavaScript多线程之HTML5 Web Worker

    在博主的前些文章Promise的前世今生和妙用技巧和JavaScript单线程和浏览器事件循环简述中都曾提到了HTML5 Web Worker这一个概念.在JavaScript单线程和浏览器事件循环简 ...

  2. Web Worker javascript多线程编程(一)

    什么是Web Worker? web worker 是运行在后台的 JavaScript,不占用浏览器自身线程,独立于其他脚本,可以提高应用的总体性能,并且提升用户体验. 一般来说Javascript ...

  3. Web Worker javascript多线程编程(二)

    Web Worker javascript多线程编程(一)中提到有两种Web Worker:专用线程dedicated web worker,以及共享线程shared web worker.不过主要讲 ...

  4. 过段时间逐步使用HTML5新增的web worker等内容

    想来快2017年了,2013年前的手机应该很少有人用了,以后逐渐使用HTML5新增的高级API吧. 先把web worker的内容再熟悉一下,因为微软虚拟学院的'面向有经验开发人员的 JavaScri ...

  5. web Worker使js实现‘多线程’?

    大家都知道js是单线程的,在上一段js执行结束之前,后面的js绝对不会执行,那么为什么标题说js实现‘多线程’,虽然说加了引号,可是标题也不能乱写不是,可恶的标题党? 姑且抛开标题不说,先说我们经常会 ...

  6. HTML5:web socket 和 web worker

    a:hover { cursor: pointer } 做练习遇到了一个选择题,是关于web worker的,问web worker会不会影响页面性能?补习功课之后,答案是不会影响. 查阅了相关资料学 ...

  7. javascript 多线程Web Worker不引用外部js文件的方法

    最近在Android开发中 Webview通过调用JavascriptInterface的方式与App交互 在交互的过程中,有些App上的操作时间会比较长,Web中调用的话会造成程序假死的情况 于是想 ...

  8. HTML5 Web Worker的使用

    Web Workers 是 HTML5 提供的一个javascript多线程解决方案,我们可以将一些大计算量的代码交由web Worker运行而不冻结用户界面. 一:如何使用Worker Web Wo ...

  9. Web Worker 是什么鬼?

    前言 前端工程师们一定有过这样的体验,当一个页面加载了大量的 js 文件时,用户界面可能会短暂地"冻结".这很好理解,因为 js 是单线程的语言.我们再走的极端点,一段 js 中出 ...

  10. Web Worker

    写在前面 众所周知,JavaScript是单线程的,JS和UI更新共享同一个进程的部分原因是它们之间互访频繁,但由于共享同一个进程也就会造成js代码在运行的时候用户点击界面元素而没有任何响应这样的情况 ...

随机推荐

  1. sql server 备份与恢复系列二 事务日志概述

    1.1  日志文件与数据文件一致性 在上一章备份与恢复里了解到事务日志的重要性,这篇重点来了解事务日志. 事务日志记录了数据库所有的改变,能恢复该数据库到改变之前的任意状态.在sql server实例 ...

  2. 非业务 Oracle SQL 语句备份

    1.创建一个将 Oracle 生成的 GUID 格式化为标准的 GUID 的函数 2.在 PLSQL 中测试并输出语句异常的语句块 3.在查询语句中日期的一种特殊表示方法 4.利用 ROWNUM 做分 ...

  3. leetcode — unique-paths

    import java.util.Arrays; /** * Source : https://oj.leetcode.com/problems/unique-paths/ * * * A robot ...

  4. 动态代理实现AOP

    代理 代理顾名思义:代为处理.不是对目标对象的直接操作,而是通过代理对目标对象进行包装,此时可以在目标对象的基础上添加额外的操作以满足业务需求.图示 分类:动态代理.静态代理. 代理三要素:共同接口. ...

  5. python 时间模块time,datetime

    模块(module)是 Python 中非常重要的东西,你可以把它理解为 Python 的扩展工具.换言之,Python 默认情况下提供了一些可用的东西,但是这些默认情况下提供的还远远不能满足编程实践 ...

  6. 详细分析MySQL的日志(一)

    官方手册:https://dev.mysql.com/doc/refman/5.7/en/server-logs.html 不管是哪个数据库产品,一定会有日志文件.在MariaDB/MySQL中,主要 ...

  7. Tomcat(二):tomcat配置文件server.xml详解和部署简介

    Tomcat系列文章:http://www.cnblogs.com/f-ck-need-u/p/7576137.html 1. 入门示例:虚拟主机提供web服务 该示例通过设置虚拟主机来提供web服务 ...

  8. 安装haproxy和haproxy命令

    HaProxy系列文章:http://www.cnblogs.com/f-ck-need-u/p/7576137.html 1.安装haproxy CentOS自带了haproxy,但可能版本比较老. ...

  9. Perl语法的基本规则

    因为是比较凌乱的用法规则收集,所以能看懂则看,不能看懂也无所谓.以后也会遇到. Perl脚本第一行使用#!.Perl的后缀名一般为".plx"或".pl",运行 ...

  10. Java线程实现与安全

    目录 1. 线程的实现 线程的三种实现方式 Java线程的实现与调度 2. 线程安全 Java的五种共享数据 保证线程安全的三种方式 前言 本篇博文主要是是在Java内存模型的基础上介绍Java线程更 ...