html5 worker的使用场景
worker可以让js有多线程一样的特性,什么地方该用呢?写了个例子:http://jsfiddle.net/walker/9angN/(请使用最新版的谷歌或火狐进行测试)。
同样一个50亿次的空循环,一个用了worker,一个是普通写法。跑起来明显的区别,worker在后台的时候,整个浏览器是可以响应的,并且页面上的计数器也能非常流畅地跳动;而普通写法是比较考验浏览器的,不那么强悍的浏览器就直接无响应了,并且计数器根本就不工作。
结果已经比较明显了,显然worker非常适合后台要做大量运算的耗时长的工作,这样会大大减少浏览器不响应的情况。不适合的地方在哪?
我们的主线程和worker是通过postMessage来通信的,监听一个message事件。而postMessage是相当消耗资源的,看这个例子,http://jsfiddle.net/walker/9angN/7/,如果每个循环里都postMessage的话(我已经把循环次数从10亿减到50万),但是响应时间还是远远超出了仅post一次的时间(如果接到message还要操作DOM或者要记录到console,那时间更是显著增加)。这还不是重点,关键是postMessage会造成页面不响应。注意,这里请结合第一个示例进行测试。
第一个例子,虽然worker在后台工作,但是页面是可以响应的,比如对页面文字进行选择操作。但是第二个例子中,50万次循环没进行完前,你的浏览器可以响应,但是页面已经不响应了,你也选择不了页面任何元素。如果这个页面是嵌套在iframe中的,那么主页面也会被锁住。
所以worker适合后台来做运算,但是不要频繁跟调用者通信,这样得不偿失。
转载于:https://www.cnblogs.com/walkerwang/archive/2013/06/06/3122720.html
html5 worker的使用场景相关推荐
- html 页面下雪效果,HTML5超逼真下雪场景效果
简要教程 这是一款基于jquery的超逼真下雪场景特效.该特效使用jquery代码来动态插件html5 canvas元素,然后在canvas中制作下雪特效. 使用方法 在页面中引入ThreeCanva ...
- html5 光影效果,基于 HTML5 WebGL 的 3D 场景中的灯光效果
原标题:基于 HTML5 WebGL 的 3D 场景中的灯光效果 构建 3D 的场景除了创建模型,对模型设置颜色和贴图外,还需要有灯光的效果才能更逼真的反映真实世界的场景.这个例子我觉得既美观又代表性 ...
- html5 canvas网页下雨场景动画js特效
下载地址一款透明的html5 canvas网页下雨场景动画特效,有意思的是按钮就像雨伞一样可以挡住雨水. dd:
- php实现下雪场景,html5 canvas逼真下雪场景动画特效
这是一款效果十分逼真的html5 canvas下雪场景动画特效插件.这款下雪特效是基于Jason Brown的Snowfall jquery plugin的基础上制作的.在Snowfall jquer ...
- 基于 HTML5 WebGL 的 3D 场景中的灯光效果
2019独角兽企业重金招聘Python工程师标准>>> 构建 3D 的场景除了创建模型,对模型设置颜色和贴图外,还需要有灯光的效果才能更逼真的反映真实世界的场景.这个例子我觉得既美观 ...
- JavaScript多线程 html5 Worker, SharedWorker
//index.html $('#test').click(function () {alert(1); }); var worker = new Worker("task.js" ...
- html5换场效果图,场景转场动画的Canvas实现
废话不说,先上图 图1:转场前 图2:转场中(动画效果此处请看末尾链接) 图3:转场后 看完效果,我们来讲讲原理. 首先我们需要准备一张转场用的图.理论上所有图片都可以作为过渡图使用. 我使用的是一张 ...
- html 灯光效果,基于 HTML5 WebGL 的 3D 场景中的灯光效果
场景搭建 整个场景中包括 2D 场景(也就是鹰眼部分)以及 3D 场景: dm = new ht.DataModel(); g3d = new ht.graph3d.Graph3dView(dm); ...
- html5不断切换的场景,HTML5场景: 沉舟侧畔千帆过(漂浮和沉没的帆船)
CSS 语言: CSSSCSS 确定 body { background: #acf0f2; overflow: hidden; } .ocean { background: #225378; pos ...
最新文章
- 在app中从下向上滑动,以找到不在默认第一页的元素
- VTK:IO之ReadPolyData
- 阿里云云服务器的端口配置问题
- 修改C盘里windows\system32\etc里面的hosts文件并保存
- 挡土墙计算软件_广联达软件如何计算钢板止水带?
- jquerymobile使用技巧
- python拼图游戏代码,OpenCV Python实现拼图小游戏
- 刚接触Python,这么多IDE我该怎么选
- CVPR 2019 | 微软亚洲研究院 7 篇精选论文解读
- 计算机视觉空间域(spatial)注意力机制——CBAM
- 【ArcGIS|空间分析|网络分析】11 利用流量数据执行网络分析
- wikioi 1098 均分纸牌
- Gmail配置邮箱客户端
- OpenGL深入探索——阴影贴图(二)
- html追加没有样式,html中append追加的表格元素和静态显示的元素样式不同?
- 用java实现四色定理
- 怎么减少计算机内存占有,还在为电脑内存占用太高而烦恼吗?教你一招轻松解决...
- java htmlunit
- 简报 | 菲律宾中央银行已经将数十家数字货币交易所合法化
- Python之Scrapy框架的安装和使用
热门文章
- 查天气43课-46课
- jquery学习之1.10-小练习-选中下拉框内容并显示
- C#时常需要调用C++DLL
- Eclipse开发Android常用快捷键
- PHP学习之路之在windows7 32位安装wampserver
- Java远程连接进程
- C# 将控件的Controls属性下的所有控件取出以便使用LINQ语句进行查询
- 睡前小故事之MySQL起源
- 阿尔伯塔大学的计算机科学专业好吗,去阿尔伯塔大学留学这些专业千万不能错过!...
- mysql.sock 初始化_mysql8.0 部署、初始化和创建实例