首页 > 其他分享 >vite 使用 webworker

vite 使用 webworker

时间:2023-05-17 09:46:32浏览次数:34  
标签:log worker ts webworker myWorker 使用 new vite

  • 不能和 vite.config 的 server.origin 配置一起使用。
  • 可以使用第三方插件。
  • 可以使用 fetch 请求和处理数据。 

 

////////////////// App.vue
<button @click="go">发送消息</button>

// vite 第一种用法:new URL + import.meta.url
var myWorker = new Worker(new URL('./worker.ts', import.meta.url))

// vite 第二种用法:加入 ?worker 后缀标识
import MyWorker  from './worker.ts?worker'
const myWorker = new MyWorker()

// 父接受子的消息
myWorker.onmessage = function (e) {
    console.log('Message received from worker', e)
}

// 父发送消息给子
function go() {
    myWorker.postMessage('hello')
}

////////////////// worker.ts

// 子接受父的消息
onmessage = function (e) {
    console.log('Message received from main script')
    const workerResult = 'Result: ' + e.data[0] * e.data[1]
    console.log('Posting message back to main script')
    // 子发送消息给父
    postMessage(workerResult)
}

 

标签:log,worker,ts,webworker,myWorker,使用,new,vite
From: https://www.cnblogs.com/CyLee/p/17407587.html

相关文章

  • kettle 在线服务 carte 数据 资源库默认大写 数据库使用默认端口
    连接已存在资源库原来是表名小写直接设置mysql表名小写vim/etc/mysql/my.cnf#值为0表示不进行转换,值为2表示区分大小写,并且会将表名存储为区分大小写的形式lower_case_table_names=1遇到资源端口3307kettle确是3306只修改了r_databse表的host、port、use......
  • 通俗易懂!像使用SQL一样使用Pandas进行数据筛选等复杂操作
    相对于学习Pandas各种数据筛选操作,SQL语法显得更加简洁清晰,若能够将SQL语法与Pandas中对应的函数的使用方法关联起来,对于我们应用Pandas进行数据筛选来讲无疑是一个福音。本文通过Pandas实现SQL语法中条件过滤、排序、关联、合并、更新、删除等简单及复杂操作,使得我们对方法的理......
  • 基于”python+requests模块“接口自动化的基本方法使用
    1,接口自动化测试1.1概念接口测试:是对系统或者组件之间的接口进行测试,主要是校验数据的交换,传递和控制管理过程,以及相互逻辑依赖关系。接口自动化测试:让程序代替人为对接口项目进行自动验证测试的过程1.2实现方式1,工具(jmeter,postman)2,代码(python-requests)1.3测试工具缺点......
  • centos上使用makefile编译sliver时 提示gcc 错误,cannot find -ldl cannot find -lpth
    github.com/bishopfox/sliver/server/usr/local/go/pkg/tool/linux_amd64/link:runninggccfailed:exitstatus1/usr/bin/ld:cannotfind-ldl/usr/bin/ld:cannotfind-lpthread/usr/bin/ld:cannotfind-lccollect2:error:ldreturned1exitstatus这个错误通常......
  • Vuex的使用
    1、Vuex介绍1.1、概念专门在Vue中实现集中式状态(数据)管理的一个Vue插件,对vue应用中多个组件的共享状态进行集中式管理(读/写),也是一种组件间通信的方式,且适用于任意组件之间的通信。1.2、什么时候使用Vuex多个组件共享同一个状态(数据)的时候。1.3、Vuex原理图注意:图中没有体现......
  • Ubuntu 使用 apt 安装 ffmpeg
    网上很多教程安装ffmpeg的时候,都是使用源码包进行编译安装,比较麻烦,还要安装一堆额外的东西。但看官网,已经提供了Ubuntu的FFmpeg包,可以直接使用apt进行安装。(ffmpeg官网https://www.ffmpeg.org/download.html)安装过程:1、更新apt:sudoaptupdate2、安装FFmpeg:sudoaptinstall......
  • SpringBoot使用EasyExcel将Excel数据直接转换为类对象
    背景相比于读取excel到List<List<String>>对象中,抽象一个方法将excel数据直接一步读取到指定的类对象中,更为方便。代码通过类Class读取excel数据到对象/***使用Class来读取Excel**@paraminputStreamExcel的输入流*@paramexcelTypeEnumExcel的格式(XLS或XLSX......
  • Eclipse使用mybatis generator自动生成代码
    一、写在前面           Mybatis属于半自动ORM,在使用这个框架中,工作量最大的就是书写Mapping的映射文件,由于手动书写很容易出错,我们可以利用Mybatis-Generator来帮我们自动生成文件。通过在Eclipse中集成mybatis-generater插件,自动生成Mybatis相关的model、dao、Mapping......
  • 使用notepad++查看DLL位数
    简便方法:直接用记事本或者notepad++打开exe文件(dll文件),会有很多乱码,不要头疼,接下来只需要在第二段中找到PE两个字母,在其后的不远出会出现d?或者L。若是d,则证明该程序是64位;若是L,则证明是32位。翻译搜索复制......
  • C# 使用7z压缩
    项目中,直接获取7z的项目Install-PackageSevenZipSharp-Version0.64.0然后,下载7z.dll https://github.com/gdoujkzz/7zdll 然后,项目会用SevenZipSharp的方法调用,7z.dll,实现对文件的7z算法压缩。///<summary>///7z压缩///</summary>publicclassR7z{......