多线程概念：

多线程是指从软件或硬件上实现多个线程并发执行的技术。具有多线程能力的计算机因有硬件支持而能够在

同一时间执行多于一个线程，进而提升整理处理性能。具有这种能力的系统包括对称多处理机，多核心处理器以及

芯片级多处理或同事多线程处理器，在一个程序中，这些独立运行的程序片段叫做线程，利用它编程的概念

就叫做多线程处理。

具有多线程能力的计算机因有硬件支持而能够在同一时间执行多于一个线程，进而提升整体处理性能。



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多线程的更多相关文章

  1. 前端常用的库和实用技术之JavaScript面向切面编程

    Aspect Oriented Programming(AOP)面向切面编程是一个比较热门的话题. AOP主要实现的目的是针对业务处理过程中的切面进行提取,它所面对的是处理过程 中的某个步骤或阶段,以 ...

  2. 前端常用的库和实用技术之JavaScript高级函数

    1.惰性载入函数 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  3. 前端常用的库和实用技术之JavaScript高级技巧

    javascript高级技巧 变量作用域和闭包 <!DOCTYPE html> <html lang="en"> <head> <meta ...

  4. 前端常用的库和实用技术之JavaScript 模块化

    模块化概念 AMD是requirejs在推广过程中对模块化定义的规范化产出. 异步加载模块,依赖前置,提前执行 Define定义模块define(['require','foo'],function( ...

  5. javascript功能插件大集合 前端常用插件 js常用插件

    转载来源:https://github.com/jobbole/aw... 包管理器管理着 javascript 库,并提供读取和打包它们的工具.•npm – npm 是 javascript 的包管 ...

  6. python进阶05 常用问题库（1）json os os.path模块

    python进阶05 常用问题库(1)json os os.path模块 一.json模块(数据交互) web开发和爬虫开发都离不开数据交互,web开发是做网站后台的,要跟网站前端进行数据交互 1.什 ...

  7. Python常用的库简单介绍一下

    Python常用的库简单介绍一下fuzzywuzzy ,字符串模糊匹配. esmre ,正则表达式的加速器. colorama 主要用来给文本添加各种颜色,并且非常简单易用. Prettytable ...

  8. WEB前端常用网站收集

    WEB前端常用网站收集整理 w3school.w3schools 前端里.脚本之家.素材家园 17素材.frontopen NEC更好的CSS方案.一些常用的JS实例 Bootstrap  官网  h ...

  9. 【转】《高级前端3.6》JavaScript多线程——Concurrent.Thread.js, WebWork

    原文链接:http://www.cnblogs.com/woodk/articles/5199536.html JavaScript多线程,在HTML5 WebWork没出现之前很多人都是用Concu ...

随机推荐

  1. docker常用

    1. docker 查看正在运行 2. docker 查看所有  3. docker 查看镜像 4. docker 运行使用 docker run --name 镜像名(自己起的镜像名字)-d(后台) ...

  2. 用js onselectstart事件鼠标禁止选中文字

    禁止鼠标选中文本,针对不同浏览器有不同的写法.常见的是onselectstart表示禁止鼠标选中文本.其中用js可以在页面中写 onselectstart="return false&quo ...

  3. pytest--fixture之参数化

    场景:测试用例执行时,有的用例需要登陆才能执行,有些用例 不需要登陆.setup和teardown无法满足.fixture可以.默认 scope(范围)function • 步骤: 1. 导入pyte ...

  4. apache+tomcat配置负载均衡，实现http与websocket接口分压

    一.应用场景 在生产环境中,应用服务器(此文以tomcat为例)不免面临高访问量的压力,相比而言web服务器(此文以apache为例)能够承担更大的并发量.Apache本身带有一些模块,可以完成对应用 ...

  5. C#链接Mysql

    先在网上找到Mysql.Data.dll组件, 文件下载地址为http://dev.mysql.com/downloads/connector/net/6.6.html#downloads ,下载平台 ...

  6. MySQL日期格式化 利用Mysql的DATE_FORMAT（）进行日期格式转换

    碰到一个MYSQL的问题,表logstatb中moment字段的内容是"年-月-日 时:分:秒",需要查询匹配“年月日”或“时:分:秒”即可的数据条目,这个时候就可以通过下面的SQ ...

  7. 前端必备，十大热门的 JavaScript 框架和库

    JavaScript 框架和库可以说是开源项目中最庞大也是最累的类目了,目前在github 上这一类的项目是最多的,并且几乎每隔一段时间就会出现一个新的项目席卷网络社区,虽然这样推动了创新的发展,但不 ...

  8. Spring容器对Bean组件的管理

    Bean对象创建 默认是随着容器创建 可以使用 lazy-init=true:在调用 getBean 延迟创建 也可以用 <beans default-lazy-init="true& ...

  9. [Nowcoder] 数数字

    题意:...咕咕懒得写了. 思路: 裸的记搜... #include <bits/stdc++.h> using namespace std; #define ll long long m ...

  10. （转）简述负载均衡&CDN技术

    转:http://www.cnblogs.com/mokafamily/p/4402366.html#commentform 曾经见到知乎上有人问“为什么像facebook这类的网站需要上千个工程师维 ...