前端常用的库和实用技术之JavaScript多线程
多线程概念:
多线程是指从软件或硬件上实现多个线程并发执行的技术。具有多线程能力的计算机因有硬件支持而能够在
同一时间执行多于一个线程,进而提升整理处理性能。具有这种能力的系统包括对称多处理机,多核心处理器以及
芯片级多处理或同事多线程处理器,在一个程序中,这些独立运行的程序片段叫做线程,利用它编程的概念
就叫做多线程处理。
具有多线程能力的计算机因有硬件支持而能够在同一时间执行多于一个线程,进而提升整体处理性能。

Concurrent.Thread.js
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="./Concurrent.Thread.js"></script>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<style>
div{
width: 100px;
height: 100px;
cursor: pointer;
background: orange;
}
</style>
</head>
<body>
<div id="test">测试点击</div>
<script>
// 将alert1拿出来,后面有异步事件队列
//alert(1);
Concurrent.Thread.create(function(){
$('#test').click(function(argument){
alert(1);
});
// 下面有一段特别复杂的函数
for(var i = 0;i<1000000;i++){
console.log(i);
}
})
</script>
</body>
</html>
webwork

//index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<!-- <script src="./Concurrent.Thread.js"></script> -->
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<style>
div{
width: 100px;
height: 100px;
cursor: pointer;
background: orange;
}
</style>
</head>
<body>
<div id="test">测试点击</div>
<script>
// 将alert1拿出来,后面有异步事件队列
//alert(1);
// Concurrent.Thread.create(function(){
// $('#test').click(function(argument){
// alert(1);
// });
// // 下面有一段特别复杂的函数
// for(var i = 0;i<1000000;i++){
// console.log(i);
// }
// })
var worker = new Worker('task.js');
worker.onmessage=function(event){
alert(event.data);
}
worker.postMessage(100000);
</script>
<script>
var worker = new SharedWorker('task.js');
worker.post.addEventListener('message',function(e){
console.log(e.data);
},false)
worker.port.start();
worker.port.postMessage('100');
</script>
</body>
</html>
//task.js
// onmessage=function(event){
// var num = event.data;
// var result = 0;
// for(var i=0;i<num;i++){
// result+=i;
// }
// //向线程创建源送回消息
// postMessage(result);
// }
onconnect = function(e){
var port = e.ports[0];
port.postMessage('connection success');
port.onmessage = function(e){
if(!e.data=='get'){
for(var i=0;i<e.data;i++){
result++;
}
}
port.postMessage(result);
}
}
by道理都懂,这个视频不懂
本文看自前端常用的库和实用技术之JavaScript多线程
前端常用的库和实用技术之JavaScript多线程的更多相关文章
- 前端常用的库和实用技术之JavaScript面向切面编程
Aspect Oriented Programming(AOP)面向切面编程是一个比较热门的话题. AOP主要实现的目的是针对业务处理过程中的切面进行提取,它所面对的是处理过程 中的某个步骤或阶段,以 ...
- 前端常用的库和实用技术之JavaScript高级函数
1.惰性载入函数 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- 前端常用的库和实用技术之JavaScript高级技巧
javascript高级技巧 变量作用域和闭包 <!DOCTYPE html> <html lang="en"> <head> <meta ...
- 前端常用的库和实用技术之JavaScript 模块化
模块化概念 AMD是requirejs在推广过程中对模块化定义的规范化产出. 异步加载模块,依赖前置,提前执行 Define定义模块define(['require','foo'],function( ...
- javascript功能插件大集合 前端常用插件 js常用插件
转载来源:https://github.com/jobbole/aw... 包管理器管理着 javascript 库,并提供读取和打包它们的工具.•npm – npm 是 javascript 的包管 ...
- python进阶05 常用问题库(1)json os os.path模块
python进阶05 常用问题库(1)json os os.path模块 一.json模块(数据交互) web开发和爬虫开发都离不开数据交互,web开发是做网站后台的,要跟网站前端进行数据交互 1.什 ...
- Python常用的库简单介绍一下
Python常用的库简单介绍一下fuzzywuzzy ,字符串模糊匹配. esmre ,正则表达式的加速器. colorama 主要用来给文本添加各种颜色,并且非常简单易用. Prettytable ...
- WEB前端常用网站收集
WEB前端常用网站收集整理 w3school.w3schools 前端里.脚本之家.素材家园 17素材.frontopen NEC更好的CSS方案.一些常用的JS实例 Bootstrap 官网 h ...
- 【转】《高级前端3.6》JavaScript多线程——Concurrent.Thread.js, WebWork
原文链接:http://www.cnblogs.com/woodk/articles/5199536.html JavaScript多线程,在HTML5 WebWork没出现之前很多人都是用Concu ...
随机推荐
- 转载:vue-cli 脚手架 安装
声明:本文转载自https://www.cnblogs.com/loveyaxin/p/7094089.html 一. node安装 1)如果不确定自己是否安装了node,可以在命令行工具内执行: n ...
- Django框架(十三)—— Djang与Ajax
目录 Djang与Ajax 一.什么是Ajax 二.Ajax的特点 1.异步 2.局部刷新 三.Ajax优点 四. 基于jquery的Ajax使用 1.基本语法 2.完整使用语法 3.利用ajax提交 ...
- CM 安装CDH 错误: 安装失败。 无法接收 Agent 发出的检测信号。
在安装CDH的时候出现错误提示: 安装失败. 无法接收 Agent 发出的检测信号. 日志提示错误: start >> raise socket.error(msg) >>er ...
- B-彻底删除卸载Ubuntu中的MySQL并重新安装(已验证)
Ubuntu-16.04,MySQL-5.7,寻找多篇有关如何彻底卸载删除MySQL的博文, 最终验证下面转发博文真实有效,推荐! https://www.jianshu.com/p/c76b31df ...
- <%#Eval() %>的常用方法
<%# %>用于数据绑定,通常是用在数据源控件里,比如GridView,Repeater等. 1.绑定Repeater 基础用法 <%# Eval("DriverName& ...
- Linux fork创建子进程
1. pid_t fork(void); 功能:创建父子进程 参数:无 返回值:成功:在父进程中:返回值为子进程的PID 在子进程中:返回值为0 失败:-1 注意: 1)fork函数是用来创建进程的 ...
- [工具]Editplus添加son格式化支持
EditPlus安装包和json.js文件地址 不喜欢CSDN的积分下载和登录下载,不喜欢百度网盘,就这么倔强 https://github.com/michael-deve/CommonData-E ...
- 从零开始搭搭建系统3.1——顶级pom制定
从零开始搭搭建系统3.1——顶级pom制定
- (一)环境搭建——Django
实验环境准备: 安装django # cmd中 pip install Django 第一个django项目HelloWorld # 在D:/Python test 下创建一个helloworld项目 ...
- CSIC_716_20191207【并发编程---进程与线程】
僵尸进程与孤儿进程 ........... 守护进程 from Multiprocessing import Process 在 suboprocess.start( ) 的上一行,增加 subpr ...