javascript多线程简介
讲多线程之前，我们先了解一下JS的事件机制
浏览器运行时，脚本必须定期让位给UI进程进行来维持网页的响应，闲置太长时间的脚本可能会被浏览器当成失控脚本，进而造成假死或弹窗
事件触发的设计javascript中的非阻塞IO机制让到来的消息在其他操作完成前排序等待，js以这种方式来模拟并发，它利用闭包、回调或promise来减少较慢操作的影响。
多线程:
举个例子：假如女朋友在洗澡，她洗澡需要30~60分钟，你不可能在卧室兴奋而焦急地等待这么长时间吧，总得找点事做吧，别TM兴奋过度，反而之后萎了，等她洗完，该干啥就干啥，其实多线线程，就是同一时刻，执行多个线程，并发处理任务
javascript本身的事件机制，决定了javascript是单线程来处理事务，但在实际应用中，往往需要使用多线程来计算一些复杂的逻辑，却不能影响页面的渲染及事件使用，这样，多线程处理，显得必不可少，那么现在介绍几种实现多线程的方式:
我们先看个例子
<script>
document.getElementById('test').onclick = function(){
alert(1);
} for(var i=0;i<100000;i++){
console.log(i);
}
</script> 浏览器直接卡死，或根本就没有反应，点击事件也用不了
What is the fuck? 这得多线程呀，咋弄？
1. Concurrent.Thread.js 适用于老式浏览器
小日本是牛逼呀，这个插件就像女优一样优秀，总能给人惊喜、试一试的冲动。
使用方式一：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button id="test">测试</button>
<script src="Concurrent.Thread-full-20080319.js"></script>
<script>
document.getElementById('test').onclick = function(){
alert('出来啦');
}; function cala(){
for(var i=0;i<100000;i++){
console.log(i);
};
} Concurrent.Thread.create(cala);
</script>
</body>
</html>
咋样，舒畅吧，头发去无踪，头屑更出众
使用方式二：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button id="test">测试</button>
<script src="Concurrent.Thread-full-20080319.js"></script>
<script type="text/x-script.multithreaded-js">
document.getElementById('test').onclick = function(){
alert('射出来');
}; for(var i=0;i<100000;i++){
console.log(i);
};
</script>
</body>
</html>
2. Worker 适用于支持H5的浏览器
不能在本地运行，需要在发布环境中执行
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button id="test">测试</button>
<script>
document.getElementById('test').onclick = function(){
alert('射出来');
}; var worker; //检测浏览器是否支持Worker
if(typeof(Worker) !== undefined){
worker = new Worker("worker.js");
worker.addEventListener("message",function(e){
//关闭worker
worker.terminate();
},false);
}else{
div.innerHTML = "IE已死，请更换浏览器!";
} </script>
</body>
</html>
worker.js 文件
for(var i=0;i<=100000;i++){
console.log(i);
//通知主线程，已经计算完了
if(i==100000) postMessage(i);
};
javascript多线程简介的更多相关文章
- Web Worker javascript多线程编程（一）
什么是Web Worker? web worker 是运行在后台的 JavaScript,不占用浏览器自身线程,独立于其他脚本,可以提高应用的总体性能,并且提升用户体验. 一般来说Javascript ...
- Web Worker javascript多线程编程（二）
Web Worker javascript多线程编程(一)中提到有两种Web Worker:专用线程dedicated web worker,以及共享线程shared web worker.不过主要讲 ...
- JavaScript面向对象简介
JavaScript面向对象简介 @(编程) [TOC] 1. 命名空间 命名空间是一个容器,它允许开发人员在一个独特的,特定于应用程序的名称下捆绑所有的功能. 在JavaScript中,命名空间只是 ...
- iOS开发多线程篇—多线程简介
iOS开发多线程篇-多线程简介 一.进程和线程 1.什么是进程 进程是指在系统中正在执行的一个应用程序 每一个进程之间是独立的.每一个进程均执行在其专用且受保护的内存空间内 比方同一时候打开QQ.Xc ...
- Javascript多线程引擎(十)---Web服务器
Javascript多线程引擎(十)---Web服务器 经过一天的努力, 引擎可以支持web服务的功能了并且支持UTF-8的编码, 具有对HTTP参数的解析,状态码的配置, 响应报文的输出等. 提供 ...
- Javascript多线程引擎(九)
Javascript多线程引擎(九)--垃圾回收 垃圾回收这个话题对Programer来说是非常老旧的话题, 从手动的malloc/free 到半自动的 引用计数 再到全自动的 mark-sweep ...
- Javascript多线程引擎(八)
Javascript多线程引擎(八) Javascript 多线程项目, 做到现在已经快3个月了(加上前期准备编译原理和必要的文档), 该项目(js-engine)已经快进入尾声了, 现在该引擎 ...
- Javascript多线程引擎(七)
Javascript多线程引擎(七)--synchronized关键字 经过两天的努力, 今天synchronzied关键字终于支持了, 如下是测试代码 thread() 是一个开启新线程的API, ...
- Javascript多线程引擎(六)
Javascript多线程引擎(六) 经过三个月的时间, Javascript 引擎已经完成beta版本(还不支持多线程特性, 预计下个星期就可以支持了, 现阶段还在进行测试基本JS单元功能), 并且 ...
随机推荐
- Android中Activity启动模式详解
在Android中每个界面都是一个Activity,切换界面操作其实是多个不同Activity之间的实例化操作.在Android中Activity的启动模式决定了Activity的启动运行方式. An ...
- jquery中获取当前点击对象
jquery中获取当前点击对象的简单方法就是,在点击事件click中传入event对象 click(function(event)); 调用当前对象就是$(event.target);
- 配置Windows Live Writer,写cnblogs博客
引言 以前写博客一般都是联网在cnblogs上面写,不好的地方就是不联网就写不了,当然我们也可以先记录在word文件,等联网在从word里面拷贝出来发布到cnblogs上面,但是样式这些 ...
- bash的for循环从命令读取值
bash的for循环可以很方便地从命令读取值,还可以指定分割值 下面的程序可以打印文件的内容,前面加上行号 #!/bin/bash # 打印每一行的内容,前面加行号 filename="/h ...
- tomcat服务器 去掉端口8080 以及项目名 直接使用IP地址访问
>>> 先在web.xml中设置默认页面 <welcome-file-list> <welcome-file>/login.jsp</welcom ...
- 实用JS大全
****************************************************************(一)常用元素,对象,事件,技巧 事件源对象 event.srcElem ...
- 【技巧性（+递归运用）】UVa 1596 - Bug Hunt
In this problem, we consider a simple programming language that has only declarations of onedimensio ...
- Fragment生命周期详解
处理fragement的生命周期 管理fragment的生命周期有些像管理activity的生命周期.Fragment可以生存在三种状态: Resumed: Fragment在一个运行中的activi ...
- 【已解决】BeautifulSoup已经获得了Unicode的Soup但是print出来却是乱码
[问题] 某人遇到的问题: 关于BeautifulSoup抓取表格及SAE数据库导入的问题(跪求大神帮忙) 简单说就是: 用如下代码: ? 1 2 3 4 5 6 7 import re,urllib ...
- poj3264
Balanced Lineup Time Limit: 5000MS Memory Limit: 65536K Total Submissions: 45777 Accepted: 21499 ...