`
mooring
  • 浏览: 96082 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

HTML5 Worker之多线程学习笔记

阅读更多

Web Worker是html5中比较吸引人的一个特性,看了官方文档(MDN),得以下的学习笔记,实属班门弄斧,请高手拍砖赐教

一 .Web Worker特点:

 

  •  与C程序在WIN32下通过的CreateThread或者利用pthread库中的pthread_create创建的线程是一致的,都是 一个
  •  系统级的线程 
  •  只能在后台运行,不能操作DOM
  •  子线程可以访问navigator对象的userAgent, platform, appVersion及appName属性
  •  通过postMessage是完整的消息克隆,不是简单的地址引用.即消息体本身有两份完整的拷贝.
  •  子线程可以通过 全局函数调用 importScripts( )将其他脚本导入到当前执行环境,如 importScripts("foo.js", "bar.js");

 

二. Web Worker简单示例:

 

  •  主页代码 : main.js
 var worker = new Worker("thread.js");
 worker.addEventListener("message", function(event) {
         console.log( "call back from the thread");
         console.log( "thread message is:" + event.data );
 });
 worker.postMessage();

 

  • 线程js代码  thread.js
self.onmessage = function( event )
{
         self.postMessage( " I am from thread !");
}

 

     //注意: addEventListener与onmessage的区别与js中其他 onclick和addEventListener("click"....的区别是一致的

 

三. 创建Web Worker的注意事项及特例

 

  1.  线程指定的js文件可能会受同源策略限制,不同的浏览器的实现有不同(Firefox 10+ 允许跨域).
  2.  由于传递的数据是独立的拷贝,所以如果主进程和线程之间的函数调用的话,可能会失败.
  3.  消息传递内部实现为:先将消息序列化,再传递,接收端得到消息后则反之,先返序列化,然后再取数据,不过这些都是自动完成的.
  4.  Chrome 17以后对传递的消息有了一种新的机制,一次性引用传递.实现机理将 主进程或线程中创建的对象通过地址传递出去,但同时本身的消息内容会被立即销毁.
  5. 子线程还可以再创建子子线程(Chrome目前不支持--Webkit内核的目前都不支持,Firefox支持但子子线程必须与子线程同源)

 

四.  子线程的销毁

1.   通过父进程/线程 可以调用 worker.terminate()来强制结束一个子线程
     worker.terminate();


2.  子线程结束自己
     nsIWorkerScope.close();

五. 小结

    首先 html5中的worker确实带来的很多惊喜,通过合理的使用worker可以给用户带来一个可用的ui界面,让用记有更好的用户体验
    其次 web worker目前的支持也有一些不统一,在处理过程中会有一些麻烦

问题:

     如果通过子线程去跨域取数据, Jsonp是否行得通,是否有更好的办法来解决这个问题了呢?  (下回解决)
 

转载请保留以下内容:
author:mooring
sites: http://mooring.iteye.com
date:2012/02/23

 

分享到:
评论

相关推荐

    html5在移动领域开发学习笔记(ppt版)

    HTML5是下一代网页标准,它的...通过学习这个HTML5在移动领域开发的学习笔记,你可以深入了解这些技术,结合实际案例进行练习,从而成为一名熟练的HTML5移动应用开发者。记住,不断实践和探索是掌握新技术的最佳途径。

    JavaFX+Jfoenix 学习笔记(七)--多线程、延迟加载源码

    在“JavaFX+Jfoenix 学习笔记(七)--多线程、延迟加载源码”中,我们将探讨两个关键概念:多线程和延迟加载。这两个概念对于提高JavaFX应用程序的性能和用户体验至关重要。 1. **多线程**: - **并发基础**:在...

    H5笔记.zip

    8. **HTML5高级API学习笔记.pdf**:HTML5引入了许多新的API,如Geolocation(定位)、Canvas(画布)、Web Storage(本地存储)、Web Workers(后台线程)等,笔记会详细介绍这些功能的应用场景和用法。 9. **H5...

    webkit开发学习笔记(全面)_第一版

    **WebKit 开发学习笔记概述** WebKit 是一个开源的 Web 内核引擎,广泛应用于苹果的 Safari 浏览器、谷歌的 Chrome 浏览器以及许多移动设备上的浏览器。WebKit 提供了网页渲染、JavaScript 执行、网络通信等功能,...

    Node.js学习笔记

    本学习笔记旨在深入解析Node.js的核心概念、特性以及常见应用,帮助你高效地掌握这一强大的开发工具。 1. **事件驱动模型** Node.js采用非阻塞I/O和事件驱动模型,使得它在处理高并发请求时表现出色。这种模型通过...

    Web前端全栈HTML5+大神之路.zip

    【文件名称列表】:有一个名为“Web前端全栈HTML5+大神之路.txt”的文件,这可能是一个文本文件,包含课程大纲、学习路径、笔记或者代码示例。文本文件通常用于记录和分享知识,对于学习者来说,可能是理解课程结构...

    良葛格DesignPattern学习笔记

    良葛格的《Design Pattern学习笔记》不仅涵盖了经典的GOF设计模式,还额外介绍了几种多线程模式,这使得这份学习笔记成为了一个宝贵的学习资源。下面将对其中的部分设计模式进行详细介绍。 #### 二、GOF设计模式 ...

    ES6笔记!HTML5!CSS3!

    3. **图形和动画**:`<canvas>`用于绘制2D图形,`<svg>`支持矢量图,`WebGL`实现3D渲染,`webworker`提升多线程处理能力。 4. **多媒体**:`<video>`和`<audio>`标签让网页可以直接嵌入视频和音频内容。 5. **文件...

    php页面静态化学习笔记.doc

    《PHP页面静态化学习笔记》 页面静态化是提高大型网站性能的重要技术手段,尤其在互联网领域,面对高流量和大数据量的挑战时显得尤为重要。本文将深入探讨PHP页面静态化的基本概念、技术原理和实现方式。 首先,...

    html最全笔记.zip

    以上只是HTML5中的一部分特性,还有更多如Web Components、Service Worker、Fetch API等特性,共同构建了现代Web开发的强大框架。通过深入学习和掌握这些知识,开发者可以创建出更具互动性、功能丰富且适应各种设备...

    STORM学习文档

    该文档对 Storm 的学习笔记,总结了 Storm 的架构、组件、工作流程等关键知识点。 一、Storm 架构 Storm 的架构主要由四个组件组成:Nimbus、Supervisor、Worker 和 Zookeeper。 * Nimbus:负责接收用户提交的 ...

    【Swoole 从入门到实战】学习笔记,从零开始学 Swoole,包括 Swoole Task,Swoole Web.zip

    5. **负载均衡与分布式**:Swoole支持多进程、多线程的部署方式,可以配合负载均衡算法实现集群部署,提高系统的可用性和伸缩性。 通过深入学习《Swoole从入门到实战》的学习笔记,开发者可以全面掌握Swoole的核心...

    狂神说Java学习笔记-GUI

    【Java GUI】(图形用户界面,Graphical User Interface)是Java编程中不可或缺的一部分,...对于初学者来说,"狂神说Java学习笔记"将是一个宝贵的资源,其中包含的源代码和图片能够直观地展示如何将理论转化为实际应用。

    JAVA并发编程实践-线程池-学习笔记

    Java并发编程实践中的线程池是一个关键的概念,它在多线程编程中扮演着至关重要的角色,有效地管理和调度线程资源,以提高系统的性能和效率。线程池通过复用已存在的线程来减少线程的创建和销毁开销,避免了频繁的上...

    Netty4.0学习笔记系列之一:Server与Client的通讯

    在本文中,我们将深入探讨Netty 4.0的学习笔记,特别是关于Server与Client之间的通信机制。 首先,我们要理解Netty的核心概念——NIO(非阻塞I/O)。Netty基于Java NIO库构建,它提供了更高级别的API,简化了多路...

    HTML5零基础速成入门.rar

    这个压缩包文件“HTML5零基础速成入门.rar”包含了作者在学习HTML5过程中的笔记,非常适合初学者作为入门教程。 HTML5的主要特点和改进包括: 1. **语义化标签**:引入了新的语义化标签,如、、、和等,使得网页...

    从零开始学 Go,Go 入门的学习笔记

    本学习笔记将从零开始,带你一步步走进 Go 语言的世界。 ### 基础语法 Go 语言的基础语法简洁明了,易于学习。首先,我们来看看变量的声明: ```go var age int = 25 ``` 这里,`int` 是数据类型,`age` 是变量名...

    3_HTML手机电脑网站_网页源码移动端前端_H5模板_自适应响应式源码.zip

    9. 开发这样的网站时,开发者需要关注性能优化,如减少HTTP请求、压缩资源、使用服务工作线程(Service Worker)进行离线缓存等,以确保在移动设备上加载速度快且流畅。 10. 开发完成后,应使用各种设备和浏览器...

    HTML5(W3CSchool版).zip

    HTML5还引入了离线存储功能,通过`Application Cache`(现在称为Service Worker)和`IndexedDB`,允许网页在离线状态下也能运行。这极大地改善了Web应用的用户体验,特别是对于那些需要大量数据交换或者在网络不稳定...

Global site tag (gtag.js) - Google Analytics