专用工作者线程worker加载模块方法,import引入和importscirpt引入

在 Web Workers 中加载其他脚本,通常有两种方式:使用 importScripts() 方法和使用 ES6 模块的 import 语法。这两种方式各有特点和适用场景。

importScripts() 方法
importScripts() 是 Web Workers 的一个内置方法,用于在 Worker 内部动态加载外部 JavaScript 文件。它是一个同步操作,意味着在脚本加载完成之前,Worker 线程会被阻塞。

特点:

同步加载:importScripts() 会阻塞 Worker 线程直到脚本加载完成。
兼容性:兼容性较好,支持较旧的浏览器版本。
全局作用域:通过 importScripts() 加载的脚本中的变量和函数会成为 Worker 的全局作用域的一部分。

const myWorker = new Worker('worker.js');// 在 worker.js 中
importScripts('script1.js', 'script2.js');

ES6 import()方法
ES6 模块的 import 语法是一种现代的模块化方案,它允许开发者以异步的方式加载模块。在 Worker 中使用 import 语法需要在 Worker 的脚本中使用 type=“module” 属性。

特点:

异步加载:import 是异步的,不会阻塞 Worker 线程。
现代语法:使用 ES6 模块语法,支持模块化开发。
模块作用域:通过 import 导入的模块具有自己的作用域,不会污染全局作用域。

//greet.sj

export function Hello()
{return '你好';
}
export function add(x,y)
{return x+y;
}
//导入普通脚本中的函数
import {Hello,add} from './greet.js';
//在这个子线者运行函数;并返回值,然后再传给主线程
self.postMessage(Hello());
self.onmessage=function(e)
{let numdata=e.data;self.postMessage(add(numdata.x,numdata.y));
}

//greetWorker.html

<html><head><meta http-equiv="content-type" content="text/html;charset=UTF-8"/><title>测试用模块来加载worker</title></head><body><script>//创建工作者专用线程,type:module表示模块;classic表示普通脚本let w=new Worker('./greetWorker.js',{type:'module'});//为线程传递参数值w.postMessage({x:5,y:6});//接收子线程返回的数据w.onmessage=function(e){console.log(e.data);}</script></body>
</html>

最后总结

区别
加载方式:importScripts() 是同步的,而 import 是异步的。
兼容性:importScripts() 兼容性更好,import 需要浏览器支持 ES6 模块。
作用域:importScripts() 加载的脚本共享全局作用域,而 import 导入的模块有自己的作用域。
语法:importScripts() 适用于传统脚本,import 适用于现代的模块化开发。

选择
如果你需要在 Worker 中加载多个脚本,并且不需要模块化开发,可以使用 importScripts()。
如果你的项目已经采用了 ES6 模块,并且需要利用模块化的优势,那么使用 import 语法是更好的选择。
总的来说,选择哪种方式取决于你的项目需求和浏览器兼容性要求。随着现代浏览器对 ES6 模块的支持越来越好,使用 import 语法在 Worker 中加载模块可能会成为主流。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/467818.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

OceanBase中,如何解读 obdiag 收集的火焰图 【DBA早下班系列】

1. 前言 在之前的文章 遇到性能问题&#xff0c;如何给OceanBase“拍CT“&#xff08;火焰图与扁鹊图&#xff09;中&#xff0c;分享了obdiag 快速收集火焰图的方法&#xff0c;那么&#xff0c;紧接着的问题便是&#xff1a;收集到火焰图和扁鹊图之后&#xff0c;该如何解读…

Day41 | 动态规划 :完全背包应用 完全平方数单词拆分(类比爬楼梯)

Day41 | 动态规划 &#xff1a;完全背包应用 完全平方数&&单词拆分&#xff08;类比爬楼梯&#xff09; 动态规划应该如何学习&#xff1f;-CSDN博客 01背包模板 | 学习总结-CSDN博客 完全背包模板总结-CSDN博客 难点&#xff1a; 代码都不难写&#xff0c;如何想…

《 C++ 修炼全景指南:十九 》想懂数据库?深入 B 树的世界,揭示高效存储背后的逻辑

摘要 本文深入探讨了 B 树的原理、操作、性能优化及其实际应用。B 树作为一种平衡多路树结构&#xff0c;因其高效的查找、插入和删除操作广泛应用于数据库与文件系统中。文章首先介绍了 B 树的定义与性质&#xff0c;并详细阐述了节点分裂、合并等核心操作的实现方法。接着&a…

选择小练习

条件语句 if 条件语句&#xff0c;也叫作选择语句、判断语句。根绝特定条件判断是否成立&#xff0c;执行不同的语句段。简单来说&#xff0c;满足条件执行&#xff0c;不满足不执行。 条件语句是使用关键字 if 做判断&#xff0c;根据不同情况结合不同的关键字else 或者 eli…

单片机串口接收状态机STM32

单片机串口接收状态机stm32 前言 项目的芯片stm32转国产&#xff0c;国产芯片的串口DMA接收功能测试不通过&#xff0c;所以要由原本很容易配置的串口空闲中断触发DMA接收数据的方式转为串口逐字节接收的状态机接收数据 两种方式各有优劣&#xff0c;不过我的芯片已经主频跑…

BAAI 的 Aquila-VL-2B-llava-qwen: 促进视觉语言理解

简介 在人工智能领域&#xff0c;北京人工智能学会&#xff08;BAAI&#xff09;做出了重要贡献&#xff1a; 在人工智能领域&#xff0c;北京人工智能研究所&#xff08;BAAI&#xff09;开发的 Aquila-VL-2B-llava-qwen 模型做出了重大贡献。这一创新模型建立在 LLava-one-v…

测试实项中的偶必现难测bug--短信触发H5拒绝行为

问题描述: 企业邀请其他人加入团队,发送邀请短信给对方,对方通过短信链接跳转到H5页面,输入手机后,点击发送验证码,前提是短信通知验证弹窗需要打开,收到短信验证码后,点击一键代入,会触发拒绝加入行为。 需求: 由于我们的邀请链接是一次性的,一旦有用户确认加入或…

MCU的OTA升级(未完-持续更新)

1.术语 ISP : In-System Programming 在系统编程&#xff0c;是一种通过MCU&#xff08;微控制器单元&#xff09;上的内置引导程序&#xff08;BootLoader&#xff09;来实现对芯片内部存储器&#xff08;如Flash&#xff09;进行编程的技术。 华大目前对应的ISP IAP&…

即将盛大启幕“2025南京软件产业博览会·南京软博会”

在今年的南京软博会上&#xff0c;科技创新的浪潮再次席卷了整个会展现场&#xff0c;来自全球的软件产业精英们汇聚一堂&#xff0c;共同见证了软件产业的最新成果与未来趋势。随着云计算、大数据、人工智能等新兴技术的蓬勃发展&#xff0c;软件产业正站在一个前所未有的历史…

npm : 无法加载文件 C:\Program Files\nodejs\npm.ps1,因为在此系统上禁止运行脚本。

npm : 无法加载文件 C:\Program Files\nodejs\npm.ps1&#xff0c;因为在此系统上禁止运行脚本。有关详细信息&#xff0c;请参阅 https:/go.microsoft.com/fwlink/?LinkID135170 中的 about_Exe cution_Policies。 所在位置 行:1 字符: 1 npm install ~~~ CategoryInf…

网管平台(进阶篇):如何正确的管理网络设备?

网络设备作为构建计算机网络的重要基石&#xff0c;扮演着数据传输、连接和管理的关键角色。从交换机、路由器到防火墙、网关&#xff0c;各类网络设备共同协作&#xff0c;形成了高效、稳定的网络系统。本文将详细介绍网络设备的种类&#xff0c;并探讨如何正确管理这些设备&a…

【Linux】【Vim】多文件编辑与分屏

多文件编辑 编辑另一个文件文件列表分屏vimdiff文件跳转 编辑另一个文件 除了为每一个要编辑的文件运行一次 Vim 之外&#xff0c;还可以在当前 Vim 中开始编辑另一个文件。 :edit foo.txtVim 会关闭当前正在编辑的文件打开指定的新文件进行编辑。如果当前文件还有未存盘的内容…

从零开始训练一个大语言模型需要多少天?

一&#xff0c;前言 在AI领域&#xff0c;训练一个大型语言模型&#xff08;LLM&#xff09;是一个耗时且复杂的过程。几乎每个做大型语言模型&#xff08;LLM&#xff09;训练的人都会被问到&#xff1a;“从零开始&#xff0c;训练大语言模型需要多久和花多少钱&#xff1f;”…

潮玩宇宙方块兽系统开发:可定制UI与多种游戏内嵌助力个性化体验

潮玩宇宙方块兽系统开发正在推动潮玩与游戏的融合&#xff0c;通过个性化的UI设计和多游戏内嵌模式&#xff0c;为用户带来了独一无二的体验。本文将从可定制UI、多游戏内嵌功能以及系统实现等方面入手&#xff0c;探讨如何构建一个极具吸引力的潮玩宇宙方块兽系统。 一、可定制…

git提交顺序为什么是:add,conmmit,pull,push

git提交顺序为什么是&#xff1a;add,conmmit,pull,push 01. add,conmmit,pull,push的顺序问题02. 扩展&#xff1a;git上传常用的六个命令包括&#xff1a;add、commit、push、clone、pull、fetch。 add&#xff1a;将文件添加到暂存区 commit&#xff1a;将暂存区中的文件提交…

服务器数据恢复—EVA存储故障导致上层应用不可用的数据恢复案例

服务器存储数据恢复环境&#xff1a; 一台EVA某型号控制器EVA扩展柜FC磁盘。 服务器存储故障&检测&#xff1a; 磁盘故障导致该EVA存储中LUN不可用&#xff0c;导致上层应用无法正常使用。 服务器存储数据恢复过程&#xff1a; 1、将所有磁盘做好标记后从扩展柜中取出。硬…

解决编译 fast-lio-lc 算法时遇到的error方法

1.创建工作空间和下载 fast-lio-lc功能包 mkdir -p fast_lio_lc_ws/src cd fast_lio_lc_ws/src/ catkin_init_workspace git clone https://github.com/yanliang-wang/FAST_LIO_LC.git2.进入工作空间,编译 编译 fast-lio-lc遇到的error: 🕐error: fatal error: opencv/cv…

软件著作权申请教程(超详细)(2024新版)软著申请

目录 一、注册账号与实名登记 二、材料准备 三、申请步骤 1.办理身份 2.软件申请信息 3.软件开发信息 4.软件功能与特点 5.填报完成 一、注册账号与实名登记 首先我们需要在官网里面注册一个账号&#xff0c;并且完成实名认证&#xff0c;一般是注册【个人】的身份。中…

鸿蒙ArkTS中的布局容器组件(Scroll、List、Tabs)

1、Scroll组件 Scroll组件是一个可滚动的容器组件&#xff0c;用于在子组件的布局尺寸超过父组件尺寸时提供滚动功能。它允许在其内部容纳超过自身显示区域的内容&#xff0c;并通过滚动机制来查看全部内容。这对于显示大量信息&#xff08;如长列表、长篇文本或大型图像等&…

webWorker基本用法

我们都知道js是一个单线程的语言&#xff0c;当线程堵塞时&#xff0c;可能会导致页面无法正常交互&#xff0c;如一些复杂的可视化处理。即使是异步处理&#xff0c;也只是将其暂存到任务队列中去&#xff0c;等主线程执行完后依然会从任务队列中取过去。 为此&#xff0c;js提…