JavaScript多线程初步学习
一、多线程理解
首先,我们要理解什么是多线程,百度百科上说:多线程(英语:multithreading),是指从软件或者硬件上实现多个线程并发执行的技术。具有多线程能力的计算机因有硬件支持而能够在同一时间执行多于一个线程,进而提升整体处理性能。具有这种能力的系统包括对称多处理机、多核心处理器以及芯片级多处理(Chip-level multithreading)或同时多线程(Simultaneous multithreading)处理器。[1] 在一个程序中,这些独立运行的程序片段叫作“线程”(Thread),利用它编程的概念就叫作“多线程处理(Multithreading)”。具有多线程能力的计算机因有硬件支持而能够在同一时间执行多于一个线程(台湾译作“执行绪”),进而提升整体处理性能。
按照我的理解就是不阻塞的前提下,时间最优的方法,不局限于流水线(单线)的方法。理解多线程的原理后,结合javascript,本身javascript是不支持多线程的。把异步处理的东西放到一个池中,当同步的解决完即图中的t1到t7,然后唤醒异步队列。

二、Concurrent.Thread.js
Concurrent.Thread.js库是利用setTimeout和setInterval方法来模拟线程的概念。并行执行任务。下载地址:Concurrent.Thread.js
主要是为了解决浏览器死卡的现象,当一个函数执行非常浪费时间和内存的时候,给另外开辟一个线程。因为javascript是单线程,会阻塞。这时候我们引入这个库文件,可以使代码不阻塞哦,应用方法主要是create方法创建一个单线程。
Concurrent.Thread.create(function(){
$('#test').click(function () {
alert(1);
});
/*下面有一段特别复杂的函数*/
for (var i = 0;i<1000000;i++) {
console.log(i);
};
});
这么就可以在浏览器上边点击div有效果,同时console也在一直不停的打印数据。各忙各的。
这是理解Concurrent.Thread.js库应用的最简单方法。Concurrent.Thread提供了一个应用JavaScript 的异步通信方式实现的定制通信库。类似于AJAX的原理,用get或者post方法发送和响应数据。具体参考可以穿越链接http://www.cnblogs.com/0banana0/archive/2011/06/01/2067402.html,这里可以看到更详细的解释。
三、WebWork
js是单线程的去跑代码,比如如果做一个循环从0到一个很大的数字相加然后输出,浏览器可能会假死(无响应状态)。但是用webwork以后,就可以非常方便的进行渲染网页的同时,计算这个数据。在 HTML5 中提出了工作线程(Web Worker)的概念,并且规范出 Web Worker 的三大主要特征:能够长时间运行(响应),理想的启动性能以及理想的内存消耗。Web Worker 允许开发人员编写能够长时间运行而不被用户所中断的后台程序,去执行事务或者逻辑,并同时保证页面对用户的及时响应。
WebWork能做什么?
1.可以加载一个JS进行大量的复杂计算而不挂起主进程,并通过postMessage,onmessage进行通信, 在主线程与子线程间进行通信,使用的是线程对象的postMessage和onmessage方法。不管是谁向谁发数据,发送发使用的都是postMessage方法,接收方都是使用onmessage方法接收数据。postMessage只有一个参数,那就是传递的数据,onmessage也只有一个参数,假设为event,则通过event.data获取收到的数据。
2.可以在worker中通过importScripts(url)加载另外的脚本文件,即多个js文件
3.可以使用 setTimeout(), clearTimeout(), setInterval(), and clearInterval():定时器可以使用线程
4.可以使用XMLHttpRequest来发送请求,使用AJAX
5.可以访问navigator的部分属性:可以在localStorage和sessionStorage
下面来具体说明一下webwork的专用线程使用步骤。
专用线程:Dedicated Worker
(1).当然是创建线程
var worker = new Worker("worker.js");
(2).为了在页面主程序接收从多线程传递过来的消息,我们需要使用多线程的 onmessage 事件处理器,定义 onmessage 的实例代码如下:
worker.onmessage = function (event) { ... };
(3).将数据传给线程
worker.postMessage(data);
(4).(worker.js)线程文件中返回结果给主页面
onmessage = function(event){
var num = event.data;
var result = 0;
for(var i=0; i<num; i++){
result += i;
}
// 向线程创建源送回消息
postMessage(result);
}
共享线程 Shared Worker
定义:共享线程可以由两种方式来定义:一是通过指向 JavaScript 脚本资源的 URL 来创建,二是通过显式的名称。当由显式的名称来定义的时候,由创建这个共享线程的第一个页面中使用 URL 会被用来作为这个共享线程的 JavaScript 脚本资源 URL。通过这样一种方式,它允许同域中的多个应用程序使用同一个提供公共服务的共享线程,从而不需要所有的应用程序都去与这个提供公共服务的 URL 保持联系。
好吧,一大段文字说明看得头疼,简单的说就是创建了一个共享线程,特点是共享,所谓共享,就是财产公有嘛.页面脚本可以与共享型web worker通信,然而,与专用型web worker(使用了一个隐式的端口通信)稍微有点不同的是,通信是显式的通过使用一个端口(port)对象并附加上一个消息事件处理程序来进行的。在收到web worker脚本的首个消息之后,共享型web worker把一个事件处理程序附加到激活的端口上。一般情况下,处理程序会运行自己的postMessage()方法来把一个消息返回给调用代码,接着端口的start()方法生成一个有效的消息进程。
.......
JavaScript多线程初步学习的更多相关文章
- json2.js的初步学习与了解
json2.js的初步学习与了解,想要学习json的朋友可以参考下. json2.js的初步学习与了解 1.)该js的下载地址是:http://www.json.org/json2.js 2.)在页面 ...
- 状态保持以及AJAX的初步学习
嘿嘿,今天学习的有点迷茫哦,主要学习把验证码使用在登录页面时间的一些逻辑,学习这个时间并没有那么的迷惑哦,可是自己写程序时间倒是有点反应迟钝,不过还好总是在最后搞清楚啦,另外就是一步一步的学习是接近项 ...
- 第二十篇 jQuery 初步学习2
jQuery 初步学习2 前言: 老师这里啰嗦一下,因为考虑到一些同学,不太了解WEB前端这门语言.老师就简单的说一下,写前端,需要什么:一台笔记本.一个文本编辑器.就没啦!当然,写这门语言, ...
- 第十九篇 jQuery初步学习
jQuery 初步学习 jQuery可以理解为是一种脚本,需要到网上下载,它是一个文件,后缀当然是js的文件,它里面封装了很多函数方法,我们直接调用即可,就比方说,我们用JS,写一个显示与隐藏,通 ...
- 以太坊web3开发初步学习
以太坊web3开发初步学习 此文是对https://learnblockchain.cn/2018/04/15/web3-html/的学习再理解. 以太坊智能合约通过使用web3.js前端和智能合约交 ...
- Web Worker javascript多线程编程(一)
什么是Web Worker? web worker 是运行在后台的 JavaScript,不占用浏览器自身线程,独立于其他脚本,可以提高应用的总体性能,并且提升用户体验. 一般来说Javascript ...
- Web Worker javascript多线程编程(二)
Web Worker javascript多线程编程(一)中提到有两种Web Worker:专用线程dedicated web worker,以及共享线程shared web worker.不过主要讲 ...
- 多线程的学习与python实现
学习了进程与线程,现对自己的学习进行记录. 目录: 一.进程与线程的概念,以及联系与区别 二.多线程 三.python中多线程的应用 四.python实例 五.参考文献 一.进程与线程的概念.以及联系 ...
- 深入浅出的javascript的正则表达式学习教程
深入浅出的javascript的正则表达式学习教程 阅读目录 了解正则表达式的方法 了解正则中的普通字符 了解正则中的方括号[]的含义 理解javascript中的元字符 RegExp特殊字符中的需要 ...
随机推荐
- ASP.net:截取固定长度字符串显示在页面,多余部分显示为省略号
方法一: public static string GetString(string str, int length) { int i = 0, j = 0; foreach(char chr in ...
- 更改mysql数据库latin1_swedish_ci为utf8
原文在http://bingu.net/472/latin1_swedish_ci-to-utf8_general_ci/把下列文件保存为一个.php文件,然后运行 <?phpdefine('D ...
- HDU2037 今年暑假不AC 贪心算法
贪心算法 : 贪心算法就是只考虑眼前最优解而忽略整体的算法, 它所做出的仅是在某种意义上的局部最优解, 然后通过迭代的方法相继求出整体最优解. 但是不是所有问题都可以得到整体最优解, 所以选择贪心策略 ...
- MongoDB基础知识 02
MongoDB基础知识 02 6 数据类型 6.1 null : 表示空值或者不存在的字段 {"x":null} 6.2 布尔型 : 布尔类型只有两个值true和false {&q ...
- Traffic Lights - SGU 103(最短路)
题目大意:有一个城市的路线图,有N个交叉点,每两个交叉点之间只有一条路,现在想从交点u去交点v,不过这个路的交通比较特别,每个路都有一个交通灯,灯有两种颜色,蓝色和紫色,例如一条路线在交点s,t之间, ...
- JSNI GWT中的东东
二.JavaScript Native InterfaceJavaScript本地接口JSNI.1)声明一个本地方法在JSNI中声明一个本地方法时,使用Java的标准native关键字,就像在JNI( ...
- 系统调用和中断处理的异同(以Linux MIPS为例)
在Linux下写一个驱动时候遇到的读操作性能问题,让我想一窥系统调用的处理流程,以查出问题的root cause.很多书把它和中断处理放在一起讲,但是又没有哪本书说清楚了,看来只有代码才能说明一切.以 ...
- Objective-C--Runtime机制
个人理解: 简单来说,Objective-C runtime是一个实现Objective-C语言的C库.对象可以用C语言中的结构体表示,而方法(methods)可以用C函数实现.事实上,他们 差不多也 ...
- Fragment的懒加载
我们在做应用开发的时候,一个Activity里面可能会以viewpager(或其他容器)与多个Fragment来组合使用,而如果每个fragment都需要去加载数据,或从本地加载,或从网络加载,那么在 ...
- Java 自带MD5加密 Demo
package demo; import java.security.MessageDigest; import java.security.NoSuchAlgorithmException; pub ...