前端常用的库和实用技术之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 ...
随机推荐
- [未解决]报错:SSLError
参考网友解决的方法 任何报SSLError类的错,解决方法: 引入ssl模块 import ssl 在url链接代码上方添加语句: ssl._create_default_https_context ...
- python项目部署
WSGI简介 Web框架和Wen服务器之间需要进行通信,如果在设计时它们之间无法相互匹配,那么对框架的选择就会限制对Web服务器的选择,这显然是不合理的.这时候需要设计一套双方都遵守的接口.WSGI是 ...
- 通过hint干掉笛卡尔积
Z_ZZZZZZZZ_BENE 大约有400万数据 修改前 SELECT xxxx FROM ( SELECT DISTINCT FIELD1_CONTENT FROM xxxxxxxx_LOG@ ...
- C#异步编程----async和await组合的写法
微软示例: private async void StartButton_Click(object sender, RoutedEventArgs e) { // ExampleMethodAsync ...
- 在KVM虚拟化中如何实现vlan
换了好几个浏览器,都不能复制文字上来,不知道为什么.就发我的笔记截图吧
- k8s 命令
Kubernetes 常用安装和使用命令总结 获取所有命名空间上的pod kubectl get pod -o wide --all-namespaces 查看pod IP时使用 kubectl ge ...
- vue 学习 cli3常用配置
---恢复内容开始--- cli3以后,构建的项目更加的简洁,配置文件也没有向cli2那样暴漏出来,但这并不代表cli3是不可配置的,我们只需要在根目录下添加一个vue.config.js作为项目的配 ...
- gitj基础2
回滚版本 git reset --hard HEAD^ 回滚上一个版本 git reset --hard 版本号(或者版本号前6位) 回滚到指定版本 如果修改版本了,也关 ...
- (转)当android调试遇到ADB server didn't ACK以及顽固的sjk_daemon进程 .
转:http://blog.csdn.net/wangdong20/article/details/20839533 做Android调试的时候经常会遇到,程序写好了,准备接上手机调试,可不一会儿出现 ...
- Java-Class-@I:org.junit.Test
ylbtech-Java-Class-@I:org.junit.Test 1.返回顶部 2.返回顶部 3.返回顶部 4.返回顶部 1. package org.junit; import ...