zoukankan      html  css  js  c++  java
  • HTML5学习总结-06 WebWorker

    一 WebWorkder

      它允许开发人员编写能够长时间运行而不被用户所中断的后台程序,去执行事务或者逻辑,并同时保证页面对用户的响应。简而言之,就是允许JavaScript创建多个线程,但是子线程完全受主线程控制,且不得操作DOM。从而,可以用webWorker来处理一些比较耗时的计算。

    好处:

      1 可以加载一个JS进行大量的复杂计算而不挂起主进程,并通过postMessage,onmessage进行通信
      2 可以在worker中通过importScripts(url)加载另外的脚本文件
      3 可以使用 setTimeout(), clearTimeout(), setInterval(), and clearInterval()
      4 可以使用XMLHttpRequest来发送请求

    局限性:
      1 不能跨域加载JS
      2 worker内代码不能访问DOM
      3 各个浏览器对Worker的实现不大一致,例如FF里允许worker中创建新的worker,而Chrome中就不行
      4 IE这个新特性

    例子:

    index.html

    <!DOCTYPE html><head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    </head>
    <p id="support">你的浏览器不支持 HTML5 Web Workers</p>
    <button id="stopButton" >停止任务</button>
    <button id="helloButton" >发送消息</button>
    <script>
    window.onload = function() {
        if( typeof (Worker) !== "undefined") {
            document.getElementById("support").innerHTML = "你的浏览器支持HTML5 Web Workers";
            worker = new Worker("worker.js");
            worker.onmessage = function(e) {
                console.log(e.data);
            }
            worker.onerror = function(e) {
                console.warn(e.message, e);
            }        
            document.getElementById("helloButton").onclick = function() {
                worker.postMessage("ok");
            }
            document.getElementById("stopButton").onclick = function() {
                worker.terminate();
            };
        }
    }
    
    </script>

    worker.js

    onmessage = function(e) {
        postMessage("worker says: " + e.data );
    }

    参考资料:

    http://www.w3school.com.cn/html5/html_5_webworkers.asp

    http://www.cnblogs.com/giggle/p/5350288.html

    http://www.cnblogs.com/giggle/p/5350288.html

  • 相关阅读:
    Silverlight文本元素—高级修饰
    C#常用集合总结2
    Silverlight图片处理——(伸展,裁剪,蒙版)
    选择“Asp.Net Web应用程序”还是“Asp.Net网站”?
    HTML5能给软件初学者带来什么呢?
    性格的弱点
    (原)jvoiplib中的examples的编译和运行
    开源的好东西
    C++编绎器编绎C语言的问题
    gcc生成静态库和动态库(转自http://blog.csdn.net/ast_224/archive/2009/03/13/3988244.aspx)
  • 原文地址:https://www.cnblogs.com/wangshuo1/p/5859418.html
Copyright © 2011-2022 走看看