什么是Web Worker?
简单点说,Web Worker就是一个运行在后台的JavaScript线程,不会影响页面的响应。
我们知道,JavaScript是单线程的脚本语言,即同一时刻只能做一件事情,否则会带来极其复杂的同步问题。比如JavaScript同时有两个线程,一个线程负责给某个DOM节点添加内容,另一个线程删除这个节点,这时,浏览器要以哪个线程为主呢?
所以,为了避免同步复杂性的问题,JavaScript从一诞生起就是单线程,这也是这门语言的特征。
JavaScript的单线程机制会带来一个问题,当有一些非常复杂的任务需要处理时,页面不得不需要等待任务处理完成才能响应用户的操作,这对于页面的响应及用户体验都会带来一些负面的影响,为了解决这个问题,同时也是为了利用多核CPU的计算能力,HTML5提出了Web Worker标准,允许JavaScript创建多个线程,但是新创建的这些线程将作为子线程并且完全受主线程的控制。并且不得操作DOM,其实本质上还是单线程。 所以,我们可以把一些费时的任务交给Web Worker创建的子线程在后台完成,而前台页面依然可以处理用户的响应。
由于Web Worker创建的线程是受限的子线程,所以会有一些使用限制:
- Web Worker无法访问DOM节点;
- Web Worker无法访问全局变量或是全局函数;
- Web Worker无法调用alert()或者confirm之类的函数;
- Web Worker无法访问window、document之类的浏览器全局变量;
不过Web Worker中的Javascript依然可以使用setTimeout(),setInterval()之类的函数,也可以使用XMLHttpRequest对象来做Ajax通信。
目前所有主流浏览器均支持 web worker,除了 Internet Explorer。
熟悉Angular的朋友应该都清楚,Angular1最被大家诟病就是它的脏检查机制,当scope的数据量过多时会严重影响性能。而Angular2正是借助WebWorker来把繁重的计算工作移入辅助线程,让界面线程不受影响。
什么是Web Worker?的更多相关文章
- JavaScript多线程之HTML5 Web Worker
在博主的前些文章Promise的前世今生和妙用技巧和JavaScript单线程和浏览器事件循环简述中都曾提到了HTML5 Web Worker这一个概念.在JavaScript单线程和浏览器事件循环简 ...
- Web Worker javascript多线程编程(一)
什么是Web Worker? web worker 是运行在后台的 JavaScript,不占用浏览器自身线程,独立于其他脚本,可以提高应用的总体性能,并且提升用户体验. 一般来说Javascript ...
- Web Worker javascript多线程编程(二)
Web Worker javascript多线程编程(一)中提到有两种Web Worker:专用线程dedicated web worker,以及共享线程shared web worker.不过主要讲 ...
- 过段时间逐步使用HTML5新增的web worker等内容
想来快2017年了,2013年前的手机应该很少有人用了,以后逐渐使用HTML5新增的高级API吧. 先把web worker的内容再熟悉一下,因为微软虚拟学院的'面向有经验开发人员的 JavaScri ...
- web Worker使js实现‘多线程’?
大家都知道js是单线程的,在上一段js执行结束之前,后面的js绝对不会执行,那么为什么标题说js实现‘多线程’,虽然说加了引号,可是标题也不能乱写不是,可恶的标题党? 姑且抛开标题不说,先说我们经常会 ...
- HTML5:web socket 和 web worker
a:hover { cursor: pointer } 做练习遇到了一个选择题,是关于web worker的,问web worker会不会影响页面性能?补习功课之后,答案是不会影响. 查阅了相关资料学 ...
- javascript 多线程Web Worker不引用外部js文件的方法
最近在Android开发中 Webview通过调用JavascriptInterface的方式与App交互 在交互的过程中,有些App上的操作时间会比较长,Web中调用的话会造成程序假死的情况 于是想 ...
- HTML5 Web Worker的使用
Web Workers 是 HTML5 提供的一个javascript多线程解决方案,我们可以将一些大计算量的代码交由web Worker运行而不冻结用户界面. 一:如何使用Worker Web Wo ...
- Web Worker 是什么鬼?
前言 前端工程师们一定有过这样的体验,当一个页面加载了大量的 js 文件时,用户界面可能会短暂地"冻结".这很好理解,因为 js 是单线程的语言.我们再走的极端点,一段 js 中出 ...
- Web Worker
写在前面 众所周知,JavaScript是单线程的,JS和UI更新共享同一个进程的部分原因是它们之间互访频繁,但由于共享同一个进程也就会造成js代码在运行的时候用户点击界面元素而没有任何响应这样的情况 ...
随机推荐
- python在接口测试的实际应用
今天看到@51Testing软件测试网 关于"关于接口测试的总结"的文章,进去浏览了一下,文章主要是针对接口测试的理论性的描述,而实战的内容没有涉及到.刚好今天我将我的系列文章的& ...
- 超炫的 CSS3 页面切换动画效果
在线演示 源码下载
- 初识Kafka----------Centos上单机部署、服务启动、JAVA客户端调用
作为Apach下一个优秀的开源消息队列框架,Kafka已经成为很多互联网厂商日志采集处理的第一选择.后面在实际应用场景中可能会应用到,因此就先了解了一下.经过两个晚上的努力,总算是能够基本使用. 操作 ...
- ZJOI2017 day1滚粗记
这几天去温州作为外省选手参加了$ZJOI day1$.打了几天的酱油,考试也滚粗了.. $day -2$ 中午从学校出发,坐飞机去温州.到了温州以后吃完晚饭就回宾馆.把一直想做的糖果公园做完了以后就堕 ...
- JS基础,你需要掌握的要点!
[循环控制语句]1.break:终止本层循环,继续执行循环后面的语句: 当循环有多层时,break只会跳过一层循环:2.continue:跳过本次循环,继续执行下一次循环: 对于for,continu ...
- Angular简易分页设计(二):封装成指令
(首先声明本文来自博客园本人原创,转载请说明出处.欢迎关注:http://www.cnblogs.com/mazhaokeng/) 之前我们讲过,Angular分页代码确实不难实现,但是由于在多个路由 ...
- cordova 基本命令 以及如何添加,删除插件
1.首先下载安装 node.js 在命令提示符 里 输入 node -v 会显示版本号证明安装成功 2.全局安装 cordova: npm install -g cordova 命令提示符里输入 ...
- application 从web.xml中获取初始化参数
<span style="font-size:24px;"> </span> 1.web.xml中的配置部分 <context-param> ...
- Android相机是如何获取到图像的
在研究zxing的过程中,脑袋中一直有个疑惑,那个相机并没有拍照,它是怎么获取图像的 带着这个疑惑查看Camera源码 Camera源码中有这样一个接口: public interface Previ ...
- SpringMVC 3.2集成Spring Security 3.2
参考:http://www.cnblogs.com/Beyond-bit/p/springmvc_and_springsecurity.html SpringMVC 3.2集成Spring Secur ...