• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >html5 > 突袭HTML5之Javascript API扩展1—Web Worker异步执行及相关概述_html5教程技巧

突袭HTML5之Javascript API扩展1—Web Worker异步执行及相关概述_html5教程技巧

作者:匿名 字体:[增加 减小] 来源:互联网 时间:2018-12-03

本文主要包含Web,Worker,异步执行等相关知识,匿名希望在学习及工作中可以帮助到您
Javascript执行机制
在HTML5之前,浏览器中JavaScript的运行都是以单线程的方式工作的,虽然有多种方式实现了对多线程的模拟(例如:Javascript 中的 setinterval 方法,setTimeout 方法等),但是在本质上程序的运行仍然是由 JavaScript 引擎以单线程调度的方式进行的。在 HTML5 中引入的工作线程使得浏览器端的 Javascript 引擎可以并发地执行 Javascript 代码,从而实现了对浏览器端多线程编程的良好支持。

Javascript中的多线程 - WebWorker
HTML5 中的 Web Worker 可以分为两种不同线程类型,一个是专用线程 Dedicated Worker,一个是共享线程 Shared Worker。两种类型的线程各有不同的用途。
专用型web worker
专用型worker与创建它的脚本连接在一起,它可以与其他的worker或是浏览器组件通信,但是他不能与DOM通信。专用的含义,我想就是这个线程一次只处理一个需求。专用线程在除了IE外的各种主流浏览器中都实现了,可以放心使用。
创建线程
创建worker很简单,只要把需要在线程中执行的JavaScript文件的文件名传给构造函数就可以了。
线程通信
在主线程与子线程间进行通信,使用的是线程对象的postMessage和onmessage方法。不管是谁向谁发数据,发送发使用的都是postMessage方法,接收方都是使用onmessage方法接收数据。postMessage只有一个参数,那就是传递的数据,onmessage也只有一个参数,假设为event,则通过event.data获取收到的数据。
发送JSON数据
JSON是JS原生支持的东西,不用白不用,复杂的数据就用JSON传送吧。例如:

WebWorker概述:https://developer.mozilla.org/en/Using_web_workers

您可能想查找下面的文章:

  • HTML5的本地存储
  • Web前端页面跳转并取到值
  • 浅析HTML5的WebSocket与服务器推送事件
  • 带你认识HTML5中的WebSocket
  • html5桌面通知(Web Notifications)实例解析
  • HTML5实现WebSocket协议原理浅析
  • html5的websockets全双工通信详解学习示例
  • 利用html5的websocket实现websocket聊天室
  • HTML5 Web Workers之网站也能多线程的实现
  • HTML5之WebGL 3D概述(上)—WebGL原生开发开启网页3D渲染新时代

相关文章

  • 2017-08-06HTML5的标签的代码的简单介绍 HTML5标签的简介
  • 2017-08-06HTML5 Canvas自定义圆角矩形与虚线示例代码
  • 2017-08-06关于HTML5的22个初级技巧(图文教程)
  • 2017-08-06HTML5为输入框添加语音输入功能的实现方法
  • 2018-12-03canvas API ,通俗的canvas基础知识(五)
  • 2017-08-06html5 视频播放解决方案
  • 2017-08-06html5 canvas fillRect坐标和大小的问题解决方法
  • 2017-08-06html5中为audio标签增加停止按钮动作实现方法
  • 2018-12-03HTML5 绘制图像(上)之:关于canvas元素引领下一代web页面的问题_html5教程技巧
  • 2018-12-03HTML5/CSS3 网页加载进度条的实现,下载进度条等经典案例

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • html5实现兼容各大浏览器的播放器的解析
    • HTML5新增标签使用方法
    • HTML5 CSS3 精美案例 -实现VCD包装盒个性幻灯片的详情
    • 在你的前端路上,印象最深的事儿是什么?
    • 处理HTML5新标签的浏览器兼容版问题
    • Web App 开发使用哪种框架比较好?
    • h5实现放大镜效果的代码
    • html5中为audio标签增加停止按钮动作实现方法_html5教程技巧
    • html5获取手机GPS信息的示例代码分享
    • 在html文件引入其它html文件的几种方法

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有