这篇文章将为大家详细讲解有关HTML5中怎么实现多线程,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。
<强>一、明确JavaScript是单线程
JavaScript语言的一大特点就是单线程,也就是说,同一个时间只能做一件事。
听起来有些匪夷所思,为什么不设计成多线程提高效率呢?我们可以假设一种场景:
假定<代码> JavaScript代码同时有两个线程,一个线程在某个DOM <代码> 节点上添加内容,另一个线程删除了这个节点,这时浏览器应该以哪个线程为准吗?
作为浏览器脚本语言,<代码> JavaScript代码的主要用途是与用户互动,以及操作DOM <代码> 。
这决定了它只能是单线程,否则会带来很复杂的同步问题。为了避免复杂性,从一诞生,<代码> JavaScript代码就是单线程,这已经成了这门语言的核心特征,估计短期内很难改变。
<强>二,新曙光:Web Worker
单线程始终是一个痛点,为了利用多核CPU <代码> 的计算能力,HTML5 <代码> 提出<代码> Web Worker> 脚本创建多个线程。但是子线程完全受主线程控制,且不得操作DOM <代码> 。
所以,这个新标准并没有改变JavaScript <代码> 单线程的本质。
<代码> Web Workers> 多线程解决方案,我们可以找到很多使用场景:
1。我们可以用<代码> Web Worker>
2。可以实现轮询,改变某些状态;
3。页头消息状态更新,比如页头的消息个数通知;
4。高频用户交互,拼写检查,譬如:根据用户的输入习惯,历史记录以及缓存等信息来协助用户完成输入的纠错,校正功能等
5。加密:加密有时候会非常地耗时,特别是如果当你需要经常加密很多数据的时候(比如,发往服务器前加密数据)。
6。预取数据:为了优化网站或者网络应用及提升数据加载时间,你可以使用工人<代码>
来提前加载部分数据以备不时之需。
加密是一个使用<代码> Web Worker> 或<代码>者利用其它魔法,它只是纯粹使用算法进行计算而已。随着大众对个人敏感数据的日益重视,信息安全和加密也成为重中之重。这可以从近期的12306用户数据泄露事件中体现出来。
一旦在工人进行计算,它对于用户来说是无缝地且不会影响到用户体验。
<强>三,兼容性
<强>四,基本概念
1。首先记得去判断是否支持
2。创建一个新的 <代码>工人很简单
postMessage()方法和> const worker =, new 工人(& # 39;src/worker.js& # 39;); worker.onmessage =, e =祝辞,{ console.log才能(e.data); }； worker.postMessage(& # 39;你好吗! & # 39;);
在主线程中使用时,<代码> onmessage 和<代码> postMessage() 必须挂在<代码> 对工人象上,而在<代码>工人> 工人> 是工人有效的全局作用域。
4。异常处理:
5。工人终止<代码>
<代码> 线工人程会被立即杀死,不会有任何机会让它完成自己的操作或清理工作。
6。工人在<代码> 线程中,<代码> 工人也可以调用自己的<代码> 方密切法进行关闭:
<强>五、快速开始
为了快速掌握,我们来做一个小例子:项目结构如下
