Inline Workers--Web workers without a separate Javascript file
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
</head>
<body> <div id="log"></div> <script id="worker1" type="javascript/worker">
// This script won't be parsed by JS engines because its type is javascript/worker.
self.onmessage = function(e) {
self.postMessage('msg from worker');
};
// Rest of your worker code goes here.
</script> <script>
function log(msg) {
// Use a fragment: browser will only render/reflow once.
var fragment = document.createDocumentFragment();
fragment.appendChild(document.createTextNode(msg));
fragment.appendChild(document.createElement('br')); document.querySelector("#log").appendChild(fragment);
} var blob = new Blob([
document.querySelector('#worker1').textContent
], { type: "text/javascript" }) // Note: window.webkitURL.createObjectURL() in Chrome 10+.
var worker = new Worker(window.URL.createObjectURL(blob));
worker.onmessage = function(e) {
log("Received: " + e.data);
}
worker.postMessage("hello"); // Start the worker.
</script>
</body>
</html>
https://www.html5rocks.com/en/tutorials/workers/basics/#toc-inlineworkers
Inline Workers--Web workers without a separate Javascript file的更多相关文章
- JavaScript是如何工作的:Web Workers的构建块 + 5个使用他们的场景
摘要: 理解Web Workers. 原文:JavaScript是如何工作的:Web Workers的构建块 + 5个使用他们的场景 作者:前端小智 Fundebug经授权转载,版权归原作者所有. 这 ...
- [翻译]Review——How JavaScript works:The building blocks of Web Workers
原文地址:https://blog.sessionstack.com/how-javascript-works-the-building-blocks-of-web-workers-5-cases-w ...
- JavaScript 工作原理之七-Web Workers 分类及 5 个使用场景
Web Workers 分类及 5 个使用场景 原文请查阅这里,略有删减,本文采用知识共享署名 4.0 国际许可协议共享,BY Troland. 这是 JavaScript 工作原理的第七章. 本系列 ...
- JavaScript 学习笔记 - Web Workers
前言 本文仅是 Web Workers 的入门科普文章,不涉及太琐碎的知识点. 我们知道,在 Web Workers 出来之前,JavaScript 是单线程的.即使是 setTimeout 之类的看 ...
- [书籍翻译] 《JavaScript并发编程》第五章 使用Web Workers
本文是我翻译<JavaScript Concurrency>书籍的第五章 使用Web Workers,该书主要以Promises.Generator.Web workers等技术来讲解Ja ...
- WijmoJS 使用Web Workers技术,让前端 PDF 导出效率更高效
概述 Web Workers是一种Web标准技术,允许在后台线程中执行脚本处理. WijmoJS 的2018v3版本引入了Web Workers技术,以便在生成PDF时提高应用程序的运行速度. 一般来 ...
- Webpack 下使用 web workers 及 基本原理 和 应用场景
_ 阅读目录 一:web workers的基本原理 二:web Workers 的基本用法 三:在webpack中配置 Web Workers 四:Web Worker的应用场景 回到顶部 一:web ...
- Web Workers
在 Web Workers 中使用 postMessage 和 onmessage 首先,需要在客户端页面的 JavaScript 代码中 new 一个 Worker 实例出来,参数是需要在另一个线程 ...
- html5 Web Workers
虽然在JavaScript中有setInterval和setTimeout函数使javaScript看起来好像使多线程执行,单实际上JavaScript使单线程的,一次只能做一件事情(关于JavaSc ...
随机推荐
- 网络热恋之SDWebImage
SDWebImage-master 是一个非常强大的三方. 当需要应用SDWeb时把文件夹里的SDWebImage文件夹放入工程里. 在需要使用网络获取图片的文件里进入头文件#import " ...
- 用GCD线程组与GCD信号量将异步线程转换为同步线程
有时候我们会碰到这样子的一种情形: 同时获取两个网络请求的数据,但是网络请求是异步的,我们需要获取到两个网络请求的数据之后才能够进行下一步的操作,这个时候,就是线程组与信号量的用武之地了. #impo ...
- DOM属性操作
HTML attribute --> DOM property 每个html属性都对应一个DOM对象属性,举个栗子: <div> <label for="userN ...
- 自定义可视化调试工具(Microsoft.VisualStudio.DebuggerVisualizers)vs.net开发工具
背景: 话说:使用CYQ.Data时,会经常断点MDataTable的对象,为了查看表格的数据内容,在监视里会常ToDataTable(),然后借可DataTable的可视化方式查看表格. 近日:心中 ...
- zh-Hans vs.net 通过 管理nuget程序包下载简体中文语言包 zh-cn
zh-Hans vs.net 通过 管理nuget程序包下载简体中文语言包 在搜索中输入:zh-hans
- TCP的粘包现象
看面经时,看到有面试官问TCP的粘包问题.想起来研一做购物车处理数据更新时遇到粘包问题,就总结一下吧. 1 什么是粘包现象 TCP粘包是指发送方发送的若干包数据到接收方接收时粘成一包,从接收缓冲区看, ...
- 从技术经理的角度算一算,如何可以多快好省的做个app
[导读]前端时间,一篇“从产品经理的角度算一算,做个app需要多少钱”的文章在网上疯传,可见大家对互联网创业的热情!这次,从一名技术经理的角度再给大家分析一下,如何使用跨平台开发技术为你节省上百万的开 ...
- 5个示例带你学习AngularJS
直到现在,你或许已经听说过AngularJS了,一个改变你对web应用思考方式,由谷歌开发的令人兴奋的开源框架.关于它的文章已经写得非常之多,但我发现还是要写些给那些更喜欢快速且实际例子的开发者.当今 ...
- oracle学习笔记系列------oracle操作例子的专用表
CREATE TABLE dept( deptno ), dname ) , loc ) ) ; CREATE TABLE emp( empno ), ename ), job ), mgr ), h ...
- top:failed tty get 错误
运行命令,ps -ef | grep test | grep -v test | awk '{ print $2 }' | xargs top -H -p 想看test的实时状态,结果报了错,查了一下 ...