美文网首页
【17】web workers的应用

【17】web workers的应用

作者: 业余玩家 | 来源:发表于2017-10-29 13:33 被阅读21次

html5的web workers中提供了在浏览器后台执行js的api,通过它我们可以将一些复杂的逻辑处理放在后台,而不影响主页面的加载,但是由于web worker位于外部文件中,导致它无法访问window,document,parent这些js对象。

在web worker中使用postmessage和onmessage进行通信,比如你可以在脚本中实现计算过程,然后将结果返回到主页面中。

//webworker.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>webwork</title>

    <script type="text/javascript">
        var worker=new Worker("webwork.js");
        worker.postMessage("hello world");
        worker.onmessage=function(event) {
            console.log(event.data);
        }
    </script>
</head>
<body>
    
</body>
</html>
//webwork.js
onmessage=function(event) {
    var d=event.data;//获取发送来的数据
    postMessage(d);//将获取到的数据返回到主线程
}

相关文章

  • 【17】web workers的应用

    html5的web workers中提供了在浏览器后台执行js的api,通过它我们可以将一些复杂的逻辑处理放在后台...

  • Service Workers

    PWA(Progressive Web App)初探总结Service Workers: 简介Web离线应用解决方...

  • 关于Service workers最强整理

    一、什么是Service workers Service workers 本质上充当 Web 应用程序、浏览器与网...

  • 初探 HTML5 Web Workers

    原文:初探 HTML5 Web Workers 一、Web Workers是什么 Web Worker为Web内容...

  • JavaScript是如何工作的:Web Workers的构建块

    摘要: 理解Web Workers。 原文:JavaScript是如何工作的:Web Workers的构建块 + ...

  • web存储、应用缓存、web workers

    客户端存储数据 两种方式: localStorage-没有时间限制的数据存储存储特点: localStorage方...

  • web Workers使用

    Web Workers可以让web应用程序具备后台处理能力,使用Worker类加载一个javascript文件来开...

  • 应用缓存及Web Workers

    应用缓存 1.优势:a.离线缓存b.加载速度c.减少服务器负载 2.实现若需要程序缓存,需要在文档 标签中包含m...

  • Service workers

    Service worker 用js控制页面请求的资源Service workers 本质上充当Web应用程序与浏...

  • Web Workers

    12月20号发布的Safri浏览器内核webkit表示自己开始支持service workers,这就意味的主流浏...

网友评论

      本文标题:【17】web workers的应用

      本文链接:https://www.haomeiwen.com/subject/ymhhuxtx.html